ES6 數組的擴展

1,擴展運算符
(...)三個點，將一個數組轉爲用逗號分隔的參數序列，擴展運算符背後調用的是遍歷器接口（Symbol.iterator）

譬如：
    console.log(...[1, 2, 3]) // 輸出1 2 3
    console.log(10, ...[2, 3, 4], 15) // 輸出 10 2 3 4 15

1，運算符還可用於函數的調用
譬如: 求兩個數和
    function add (x,y){
        return x + y;
    }
    var param = [10,20]
    add(...param) // 輸出30

2，運算符可與正常函數參數一同使用
例子：
    function f(a, x, y, z) { }
    const args = [0, 1];
    f(...args, 2, ...[3]);

3，運算符還能夠替代apply（小技巧）[將數組轉爲函數的參數了]
    // es6以前
    function d (x,y){}
    var param = [1,2]
    d.apply(null,param)
    // es6
    function d(x,y){}
    let param = [1,2]
    d(...param)
    
4，將a數組添加到b數組
    // es6以前
    var a = [1,2,3],b = [7,3,1];
    Array.prototype.push.apply(a,b) // 輸出 [1,2,3,7,3,1]
    // es6
    let a = [1,2,3],b = [8,1,3];
    a.push(...b) // 輸出 [1,2,3,8,1,3]

2,運算符的使用

1，數組複製
    const a1 = [1, 2];
    // 寫法一
    const a2 = [...a1];
    // 寫法二
    const [...a2] = a1;
    
2，數組合並（注：淺拷貝）
   var a = [1,5],b = [8], c = [10,12];
   // es5以前
   a.concat(b,c) // 輸出 a，b，c合併集合
   // es6
   [...a, ...b, ...c]
   
3，與解構賦值結合使用（注：若是擴展運算符用於數組賦值，只能放在參數的最後一位，不然會報錯）
   // ES5
    a = list[0], rest = list.slice(1)
    // ES6
    [a, ...rest] = list
    下面是另一些例子。
    const [first, ...rest] = [1, 2, 3, 4, 5];
    first // 1
    rest // [2, 3, 4, 5]
    const [first, ...rest] = [];
    first // undefined
    rest // []:
    const [first, ...rest] = ["foo"];
    first // "foo"
    rest // []
    
4，字符串
   1，把'first'分解爲以字母爲值的數組
   [...'first'] // 輸出["f", "i", "r", "s", "t"]
   2，特別注意 （js會將四個字節的 Unicode 字符，識別爲 2 個字符）因此建議採用運算符形式
   'x\uD83D\uDE80y'.length // 輸出4
    [...'x\uD83D\uDE80y'].length // 輸出3
 
5，實現了 Iterator 接口的對象  運算符可把該對象轉爲數組不然則不行
   譬如獲取頁面全部P元素
   let nodeList = document.querySelectorAll('p');
   let array = [...nodeList];
   
6，Map 和 Set 結構，Generator 函數（注意：有Iterator接口的均可以使用運算符）
   1，map
    let map = new Map([
      [1, 'one'],
      [2, 'two'],
      [3, 'three'],
    ]);

    let arr = [...map.keys()]; // 輸出[1, 2, 3]
    
   2，Generator 函數運行後，返回一個遍歷器對象
   const demo = function*(){
      y 1;
      y 2;
      y 3;
    };

    [...demo()] // 輸出[1, 2, 3]

3,Array.from() 將類數組轉爲真正數組（任何有length屬性的對象，均可以經過Array.from方法轉爲數組，擴展運算符則不行）

1，類對象轉數組
    let test = {
        '0': 'a',
        '1': 'b',
        '2': 'c',
        length: 3
    };

    // ES5的寫法
    var arr = [].slice.call(test); //輸出 ['a', 'b', 'c']

    // ES6的寫法
    let arr2 = Array.from(test); //輸出 ['a', 'b', 'c']
   
2，Array.from還能夠接受第二個參數
  Array.from([1, 2, 3], (x) => x * x) //輸出 [1, 4, 9]

4,Array.of() Array.of方法用於將一組值，轉換爲數組

注意：
    Array.of基本上能夠用來替代Array()或new Array()，而且不存在因爲參數不一樣而致使的重載。它的行爲很是統一，而array只有當參數個數很多於 2 個時纔會返回數組
    Array.of(1,2,3,5)// 輸出 [1,2,3,5]

5,數組實例的 copyWithin()

Array.prototype.copyWithin(target, start = 0, end = this.length)
    此方法接受三個參數。

    1，target（必需）：從該位置開始替換數據。若是爲負值，表示倒數。
    2，start（可選）：從該位置開始讀取數據，默認爲 0。若是爲負值，表示從末尾開始計算。
    3，end（可選）：到該位置前中止讀取數據，默認等於數組長度。若是爲負值，表示從末尾開始計算。
    
    例子：
    [1, 2, 3, 4, 5].copyWithin(0, 3)
    
    [1, 2, 3, 4, 5].copyWithin(0, 3, 4)

6，數組 find() 和 findIndex()

1，find 用於找出第一個符合條件的數組成員
    找出小於0的元素
    [1, 4, -5, 10].find((n) => n < 0)
  
   2，findIndex 用於找出第一個符合條件的數組成員位置
    找出元素位置
    [1, 5, 10, 15].findIndex(function(value, index, arr) {
      return value > 9;
    })

7,數組fill() fill方法使用給定值，填充一個數組 待補充

8,數組 entries()，keys() 和 values() ES6新增方法

注：區別在於keys()是對鍵名的遍歷、values()是對鍵值的遍歷，entries()是對鍵值對的遍歷。

    譬如：
    for (let index of ['a', 'b'].keys()) {
      console.log(index);
    }
    // 輸出 0
    // 輸出 1

    for (let elem of ['a', 'b'].values()) {
      console.log(elem);
    }
    // 輸出 'a'
    // 輸出 'b'

    for (let [index, elem] of ['a', 'b'].entries()) {
      console.log(index, elem);
    }
    // 輸出 0 "a"
    // 輸出 1 "b"