一、基礎概述

vue 教程中有一段 demo code，如下：

這個表達式Array.apply(null, { length: 20 })有點讓人費解。第一感覺這個表達式就是為了創(chuàng)建一個長度為20的數(shù)組，但表達式Array(20)也可以實現(xiàn)這個功能啊，為啥非要寫那么復雜呢？

于是乎就想，如果是這樣子，那么我把這一段代碼換成 Array(20) ,變成下面這樣：

JS 代碼實現(xiàn)

控制臺打印

那么按照剛剛的理解，把代碼換成這個樣子應該是沒有問題的。然而打印結果告訴我們剛剛那樣子地理解應該是不對的， Array.apply(null, { length: 99 })和Array(99) 這兩句代碼還是有區(qū)別的，那么區(qū)別是什么？

二、解析

2.1 apply 函數(shù)方式

ES5開始 apply 函數(shù)的第二個參數(shù)除了可以是數(shù)組外，還可以是類數(shù)組對象（即包含length屬性，且length屬性值是個數(shù)字的對象）。對象{length: 2}就是一個類數(shù)組對象，因為沒有初始化下標0，1的值，所以獲取0，1下標的值得到的都是undefined。

這樣表達式 Array.apply(null, { length: 2}) 就等價于如下代碼：

這樣就很容易知道該表達式的值是一個長度為2，且每個元素值都被初賦值為 undefined 的數(shù)組（注意此時不是數(shù)組元素沒有初始化，而是初始化成undefined，這就是跟 Array(2) 的區(qū)別）

為啥非要寫那么復雜呢？

即map函數(shù)并不會遍歷數(shù)組中沒有初始化或者被 delete 的元素（有相同限制還有 forEach, reduce 方法）。所以寫這么“復雜”就是為了實現(xiàn)：創(chuàng)建一個長度為 99，且每個元素都被初始化的數(shù)組。這樣 map 方法就可以循環(huán) 99 次了。

可以修改成

ES6方式

2.2 構造函數(shù) + 一個數(shù)字參數(shù)

直接調用Array函數(shù)跟new方式調用是等價的，即

表示創(chuàng)建一個長度為 99 的數(shù)組，注意該數(shù)組的元素并沒有被初始化（[empty ×99]），即