袁磊老师的课，ES6（二）

• 一、数组：扩展运算符

const a2 = [...a1]
//这句话的意思就是给a1起了一个新的名字，a1变a2也变；
[...arr1, ...arr2, ...arr3] 
//把数组arr1、arr2、arr3罗列在一起
const[first, ...rest] = [1,2,3,4,5];
//其中，first是1， rest是数组[2,3,4,5] , rest是个数组

• 二、类似数组的对象 array-like object
  DOM操作返回的NodeList集合，以及函数内部的arguments对象
  nodeList不是一个数组，是一个类似于数组的东西。

let array = [...nodeList];
//...的作用还可刻意把一个类数组转变为一个真正的数组。

Array.form方法用于将两类对象转为真正的数组：类似数组的对象（array-like object）和可遍历（iterable）的对象

let arr2 = Array.from(arrayLike);
//正式的转变方法，arr2是一个真正的数组。

• 三、数组的定义
  Array.of()

var arr = new Array(1,2,3,4);
var arr = new Array(4);
//上面两句话有歧义，array（4）有可能是一个含有4个元素的数组，也可能是只有一个元素，元素是4的数组
var arr = new Array();
var arr = [];

• 四、数组新方法

//copyWithin（拷贝到哪里的下标，开始拷贝的内容下标，结束拷贝的内容下标）
//左闭右开
[1,2,3,4,5].copyWithin(0, 3, 4)
//上面的代码运行后，前面的数组就变为[3,1,2,3,4,5]

• 五、数组循环
• forEach(value, index, name){}
  不仅可以循环数组，还可以循环对象
• for(i in arr){ consloe.log(i);}
• for(v of arr){ consloe.log(v);}
• var na = arr.map(function(v){return v+5;});

练习

 <script>
        let arr = [11, 21, 31, 41, 51, 61];
        let a = [...arr]; //这里的a就是一个新的数组
        let b = a; //又定义了一个变量b等于a ,b是a的一个别名，a变了b就变了，只有对象是这样，对象是引用类型，普通的是值类型
        a[2] = 1000;
        console.log(b[2]); //a和b指向的是内存中的有一个空间，是同一个东西！！！！！只有对象是这样！！！！
        console.log("a和b指向的是内存中的有一个空间，是同一个东西！！！！！只有对象是这样！！！！"); //a和b指向的是内存中的有一个空间，是同一个东西！！！！！只有对象是这样！！！！
        console.log(arr[2]);

        let [first, ...rest] = arr;
        console.log(rest[2]); //first是11， rest[2]是41

        a.copyWithin(1, 3, 5); //将a中的3.4号元素拷贝到第一、第二下标的元素中，a数组变为：[11,41,51,41,51,61]
        console.log(a);

        var rs = arr.find(v => {
            return v > 30;
            // 找到第一个比30大的元素
        });
        console.log(rs);

        function qiuhe(...rest) {
            array.forEach(element => {
                sum += element;
                return sum;
            });
            console.log(sum);
        }
        qiuhe(15, 15, 23);
        qiuhe(11, 3, 4, 5, 666);
    </script>

循环的练习

    <script>
        let arr = Array.of(11, 21, 31, 41, 51, 61);
        arr["yuan"] = "lei";
        console.log(arr.length);
        //通过第14行这种加入方式是不占长度的

        // 传统方法
        for (let i = 0; i < arr.length; i++) {
            console.log(i + ":" + arr[i]);
        }

        // foreach方法
        arr.forEach((v, i) => {
            // 两个参数，v是元素，i是下标
            console.log(i + ":" + v);
        })

        // for in 方法
        for (k in arr) {
            console.log(k + ":" + arr[k]);
            //k是下标
            // 此方法会输出非正常下标的元素
            //此方法可以运用到json中
        }

        // for of 循环
        for (v of arr) {
            console.log(v);
            // 想要输出index，不要用这个for of 循环
        }

        // map循环,一种映射，出一个新的数组
        var narr = arr.map((v, i) => {
            // 第一个参数是value， 第二个参数是index，第三个参数是数组arr,第三个参数一般用不到
            return v * v;
        });
        console.log(narr);
    </script>

• ES6的扩展-rest参数
  ES5引入rest参数（形式为“…变量名”），用于获取函数的多于参数，这样就不需要使用arguments对象了。rest三叔搭配的变量是一个数组，该变量将多于的参数放入数组中。