ES6對於陣列又擴充套件了很多方法
包括靜態方法和原型鏈上新增的方法
讓我們可以更方便的運算元組

靜態方法

Array.from()

這個方法可以將
類陣列物件（有length屬性的物件）和可遍歷物件（ES6新增的Set與Map資料結構）
轉化為真正的陣列

在ES6之前，要想讓類陣列物件變成陣列
通常做法是呼叫slice

let arrLike = {
    0: 10,
    1: 20,
    2: 30,
    length: 3
}

let arr = Array.prototype.slice.call(arrLike);
console.log
 
(arr); //[10, 20, 30]

現在我們可以這麼做

let arr = Array.from(arrLike);
console.log(arr); //[10, 20, 30]

如果引數是一個數組，那麼會返回一個一模一樣的新陣列（淺拷貝）
而且這個方法會將陣列空位轉換為undefined
換句話說，會忽略空位

let arr = Array.from([10, , 30]);
console.log(arr); //[10, undefined, 30]

還要注意拷貝的陣列是淺拷貝

let arr = [10, ['a', 'b'] , 30];
let newArr = Array.from(arr);
console
 
.log(newArr); //[10, ['a', 'b'], 30]
arr[1].push('c');
console.log(newArr); //[10, ['a', 'b', 'c'], 30]

這個方法還有一個額外的引數
用於對元素進行處理
類似於ES5的陣列方法map

let arrLike = {
    0: 10,
    1: 20,
    2: 30,
    length: 3
}
let arr = Array.from(arrLike,function(x){
    return x*x;
});
console.log(arr); //[100, 400, 900]

Array.of()

這個方法很簡單
用於將一組值轉換為陣列
它彌補了使用new Array()構造陣列的奇怪行為
比如說填入一個引數

let arr = new Array(3); //構建了一個稀疏陣列

只填寫一個引數就會構建一個長度為3的稀疏陣列
這不是我們想要的
但Array.of()可以很好的解決這個問題

let arr1 = Array.of(3);
let arr2 = Array.of(1, 2, 3);
let arr3 = Array.of();
let arr4 = Array.of(undefined);
let arr5 = Array.of(null);
console.log(arr1); //[3]
console.log(arr2); //[1, 2, 3]
console.log(arr3); //[]
console.log(arr4); //[undefined]
console.log(arr5); //[null]

填什麼就構造什麼樣的陣列
不填就返回什麼空陣列

陣列操作

內部拷貝copyWithin()

這是一個原型方法
作用是把這個陣列的一部分元素複製到其他位置
這會覆蓋原有的元素
返回當前陣列
換句話說，這個方法會修改原陣列

let arr = [1, 2, 3, 4, 5, 6, 7, 8];
arr.copyWithin(1, 5, 8);
console.log(arr); //[1, 6, 7, 8, 5, 6, 7, 8]

第一個引數代表從這個位置開始替換
後兩個引數代表要拷貝的起始位置和結束為止
同樣不包含結束元素，左閉右開
可以使用負值代表倒數

查詢find()與findIndex()

這兩個原型方法都有一個回撥函式作為引數
（回撥函式的引數依次為元素、索引、陣列引用，與ES5陣列方法相同）
find()會返回第一個滿足條件的元素
findIndex()會返回第一個滿足條件的索引
沒有找到都會返回-1
這裡滿足條件意思就是函式引數返回值為true

let arr = [10, 20, 30, 40, 50];
console.log(arr.find(function(value, index, arr){
    return value > 25;
}));// 30
console.log(arr.findIndex(function(value, index, arr){
    return value > 25;
}));// 2

填充fill()

這個方法用於填充陣列
會修改呼叫它的陣列

let arr = [1, 2, 3];
console.log(arr.fill(100)); //[100, 100, 100]

這裡陣列所有的元素都被替換為100

let arr = new Array(3);
console.log(arr.fill(100)); //[100, 100, 100]

此外還可以指定填充的起始位置和終止位置

let arr = [1, 2, 3, 4, 5];
console.log(arr.fill(100, 1, 4)); //[1, 100, 100, 100, 5]

包含includes()

這個方法用於檢測陣列是否含有某個特定值
返回布林值

let arr = [1, 'a', true, null, NaN];
console.log(arr.includes(1));            //true
console.log(arr.includes('a'));          //true
console.log(arr.includes(true));         //true
console.log(arr.includes(null));         //true
console.log(arr.includes(NaN));          //true
console.log(arr.includes(undefined));    //false
console.log(arr.includes());             //false

這個方法甚至連NaN都可以檢測到
但是我們ES5中的indexOf()是不可以的

let arr = [1, 'a', true, null, NaN];
console.log(arr.indexOf(1));             //0
console.log(arr.indexOf('a'));           //1
console.log(arr.indexOf(true));          //2
console.log(arr.indexOf(null));          //3
console.log(arr.indexOf(NaN));           //-1

由此可見indexOf()內部是用嚴格等於判斷的
我們可以這樣來判斷NaN

let demo = NaN;
console.log(demo + '' === 'NaN'); //true

這裡注意isNaN()不僅僅是非數返回true
不是數字都會返回true

陣列迭代

keys()、values()與entries()

它們用於迭代陣列
均返回一個迭代器物件
配合for-of迴圈可以迭代陣列

var arr = ['A', 'B', 'C'];
for(let index of arr.keys()){ //遍歷索引
    console.log(index);
}//0 1 2
for(let item of arr.values()){ //遍歷元素
    console.log(item);
}//'A' 'B' 'C'
for(let x of arr.entries()){ //遍歷索引和元素
    console.log(x);
}//[0, 'A'] [1, 'B'] [2, 'C']
for(let [index, value] of arr.entries()){ //遍歷索引和元素
    console.log(index + ': ' + value);
}//0: 'A'  1: 'B'  2: 'C'

（這裡values()方法我測試的新版本谷歌瀏覽器不知道為什麼還沒有實現）
當然我們也可以手動遍歷

var arr = ['A', 'B', 'C'];
var ite = arr.entries();
console.log(ite.next().value); //[0, 'A']
console.log(ite.next().value); //[1, 'B']
console.log(ite.next().value); //[2, 'C']

不過for-of就是用於遍歷陣列的（用for-in遍歷物件）
如果全遍歷使用for-of更加方便

類比於ES5的Object.keys/Object.values/Object.entries

let person = {
    name: 'payen',
    sex: 'male',
    age: 19
}
console.log(Object.keys(person));//["name", "sex", "age"]
console.log(Object.values(person));//["payen", "male", 19]
console.log(Object.entries(person));//[ ["name","payen"], ["sex", "male"], ["age", 19] ]