在ES6之前，創建數組的方式有2種：
一: 通過數組字面量
let array = [1,2,3]; console.log(array);//[1,2,3]
二: 通過new Array()創建數組
let array = new Array(1, 2, 3); console.log(array); //[1,2,3]
在大多數情況下new Array()運行良好：
let array = new Array(1, 2);
console.log(array.length); //2
console.log(array[0]); //1
console.log(array[1]); //2
array = new Array('a');
console.log(array.length); //1
console.log(array[0]);//'a'
array = new Array(1, 'a');
console.log(array.length); // 2
console.log(array[0]);//1
console.log(array[1]);//'a'
但是new Array()有一種詭異的情況：
let array = new Array(2); console.log(array[0]); // undefined console.log(array[1]);// undefined console.log(array.length); // 2
當我們給new Array()傳遞單個數字參數時，這個數字不是作為數組元素，而是該數組的length屬性而存在，而數組本身則是一個空數組。
為了解決上面這個令人類沒有安全感的特性，ES6引入了Array.of()來解決這個問題：
三：Array.of()
顧名思義，of()方法就是以它接受到的參數作為元素來創造數組，上面我們說的單個數字參數的情況也同樣適用：
let array = Array.of(3);
console.log(array.length); // 1
console.log(array[0]); // 3
array = Array.of(1, 2);
console.log(array.length);// 2
console.log(array[0]); // 1
console.log(array[1]);// 2
array = Array.of('a');
console.log(array.length);// 1
console.log(array[0]);// 'a'
array = Array.of(1, 'a');
console.log(array.length); // 2
console.log(array[0]);// 1
console.log(array[1]);// 'a'
四：Array.from()
ES6還增加了一個Array.from()，也是用了創建一個數組。它主要用在以類數組對象和可迭代對象為藍本，創建對應的數組。
1: Array.from(類數組對象)
我們最熟悉的類數組對象，應該就是function的arguments對象了。接下來，我們看一個用Array.from()創建包含arguments元素的數組：
function createArrayFrom() {
console.log(arguments instanceof Array); // false
return Array.from(arguments);
}
let array = createArrayFrom(1, 2, 3);
console.log(array instanceof Array); // true
console.log(array.length); //3
console.log(array[0]);//1
console.log(array[1]);//2
console.log(array[2]);//3
console.log(array.indexOf(2)); //1
2: Array.from(可迭代對象)
Array.from()也可以把一個可迭代對象轉換為數組：
let iteratorObject = {
*[Symbol.iterator](){
yield 1;
yield 2;
yield 3;
}
};
let array = Array.from(iteratorObject);
console.log(array instanceof Array); // true
console.log(array.length); // 3
console.log(array[0]); // 1
五：Array.from()的第二個參數
前面的例子，我們看到了一個類數組對象和可迭代對象作為Array.from()的第一個參數，從而創建出包含它們元素的數組。Array.from()的第二個參數是一個函數，這個函數用來將類數組對象和可迭代對象的元素進行某種變換后，再作為生出數組的元素，例如：
let iteratorObject = {
*[Symbol.iterator](){
yield 1;
yield 2;
yield 3;
}
};
let array = Array.from(iteratorObject, (item)=>{return item + 1});
console.log(array[0]); //2
console.log(array[1]); //3
console.log(array[2]); //4
這個例子里，我們提供了把每個元素值加一的變換，所以原本的1，2，3，置換到新的數組之后，元素是2，3，4。
六： Array.from()的第三個參數
Array.from()還提供第三個參數可用，第三個參數用來指定this的值，如果在整個方法的調用中有用到this 的話，看一個例子：
let firstHelper = {
diff: 1,
add(value){
return value + this.diff;
}
};
let secondHelper = {
diff: 2
};
function createArrayFrom() {
return Array.from(arguments, firstHelper.add, secondHelper);
}
let array = createArrayFrom(1, 2, 3);
console.log(array); //[3, 4, 5]
上面的例子里面，我們的在add()方法里面使用了this(這行代碼：value + this.diff)，并且add()定義在firstHelper對象，且firstHelper對象也有diff屬性，但是我們的第三個參數傳入的是secondHelper，所以在firstHelper.add()方法里的this值是secondHelper。
以上就是ES6新增的Array.of()和Array.from()方法，可以使得開發者用更少的代碼應對更多變的創建數組的場景。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
