1. 程式人生 > >更好的實現js數組連接,用到的知識apply.

更好的實現js數組連接,用到的知識apply.

講解 ber array 方便 this var 但是 ken 兩個

最近做的萬達的一個能源管理平臺中用到了數據連接,當時想都沒想直接寫了一個a.concat(b)。今天在掘金看到了一個優化的方案。是這樣:a.push.apply(a,b);其中a,b分別為兩個數組。仔細一想才知道,原來concat方法會創建一個新的數組,並且循環a,b兩個數組,然後返回這個新的數組。這樣就不會改變a,b數組的值了。但是同樣的創建一個新的數組同樣會有些性能方面的問題,即使很小,很小。但是作為一個代碼潔癖者,總想著要把他優化到自己的極限。

  然後,重點到了。我們來搞搞apply吧。這才是重中之重,授人以魚不如授人以漁。只有學到了基礎才能舉一反三。學apply,主要參考的就是js的mdn了。自認為這個講的不錯的,有例子,有兼容性講解,有參數說明。最主要的還是中文的,很方便,有沒有?

  一般研究問題我喜歡從三個方面入手,what,why,how,那麽開始吧!

  what:簡潔的說改變當前方法的this對象並且傳入一個數組參數,並且讓這個方法執行。我們就拿上邊的例子來說明一下吧。a.push.apply(a,b);這個語句說明的就是push方法執行之前,我們把push方法的this改變為a,並且傳入了b這個參數。註意,b這個參數是一個數組。apply會把b中的值一個個取出來然後作為push方法的參數。因此相當於

數組a一個個push數組b中的每一項。因此最後的a數組的值就是 合並後的值了。這樣會改變數組a的值。如果有需求的話可以在執行這個之前把數組a用另外的變量存起來。

  why:用處多多,不一一說明了,僅僅把mdn上簡單的列舉一個,以下代碼的功能是求出數組中的最大最小值。

/* min/max number in an array */
var numbers = [5, 6, 2, 3, 7];

/* using Math.min/Math.max apply */
var max = Math.max.apply(null, numbers); /* This about equal to Math.max(numbers[0], ...) or Math.max(5, 6, ..) */
var min = Math.min.apply(null, numbers);

/* vs. simple loop based algorithm */
max = -Infinity, min = +Infinity;

for (var i = 0; i < numbers.length; i++) {
  if (numbers[i] > max)
    max = numbers[i];
  if (numbers[i] < min) 
    min = numbers[i];
}
講了這麽多:how?應該可以簡單使用了吧!最後再啰嗦一句吧,call和apply的用法基本一樣,唯一的不同之處就是call中參數不是數組了,而是一個個參數,相當於把數組一項項分開列出來而已。

更好的實現js數組連接,用到的知識apply.