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"