数组的扩展----ES6学习笔记

1.扩展运算符

含义：扩展运算符是三个点(…)，用于将一个数组转为用逗号分隔的参数序列，主要用于函数调用。

   function demo(x,y){
       return x + y;
   }
   let arr = [3,4];
   demo(...arr);//7

上面例子中，扩展运算符将arr数组转换为参数序列，并执行demo函数。

1.1扩展运算符的应用

1.复制数组

由于数组是复合数据类型，直接复制，只是复制了数组的地址(指针)，并不是克隆一个全新的数组。

     let arr1 = [1,2,3];
     let arr2 = arr1;  //只是复制了arr1数组的指针
     arr2[0] = 100;
     console.log(arr1);//Array(3) [ 100, 2, 3 ]

如果要克隆一个数组，可以采用下面的代码：

    //ES5实现:
    var a = [1,2,3,4];
    var b = a.concat();
    
    //ES6实现:
    let arr1 = [1,2,3];
    let arr2 = [...arr1]; //使用扩展运算符克隆一个数组

2.合并数组

     var a1 = ["a","b","c"];
     var a2 = ["d","e"];
     var a3 = ["f"];
     //ES5实现:
     a1.concat(a2,a3);

     //ES6实现:
     [...a1,...a2,...a3];

3.实现了 Iterator 接口的对象
任何定义了遍历器（Iterator）接口的对象，都可以用扩展运算符转为真正的数组。相反，如果一个对象没有定义遍历器(Iterator)接口，就不能使用扩展运算符将其转换为数组。

let nodeList = document.querySelectorAll('div');
let array = [...nodeList];

上面例子中，querySelectorAll方法返回的是一个NodeList对象。它不是数组，而是一个类似数组的对象。这时，扩展运算符可以将其转为真正的数组，原因就在于NodeList对象实现了 Iterator 。

注意：对于没有定义Iterator的对象，扩展运算符不能将其转换为数组。

  let obj = {
        name:"xiaowang",
        age:20,
        sex:"man",
        length:3
  }
  [...obj];//TypeError: obj is not iterable

上面例子中，obj没有定义Iterator，所以不能使用扩展运算符将其转换为数组。这时可以使用Array.from()方法将其转换为数组。

---

2.Array.from()

3.Array.of()

4.数组实例的find()和findIndex()

5.数组实例的fill()

6.数组实例的entries()，keys()，和values()

7.数组实例的includes()