ES6复制数组

ES6复制数组和合并数组

一、复制数组与合并数组

　　复制数组：它是复合数据类型,直接复制只是复制了指向底层数据结构的指针,而不是复制一个全新的数组

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>数组的扩展</title>
    </head>
    <body>
    </body>
    <script type="text/javascript">
        /* 
            1、扩展运算符：扩展运算符（spread）是三个点，类似rest参数的逆运算，将一个数组转换为逗号分隔开的参数序列
        *****/
        console.log(...[1, 2, 3]);

        // 主要用于函数的的调用
        function push(arr, ...items) {
            // 函数的调用,使用扩展运算符,该运算符将一个数组变为参数序列
            arr.push(...items);
        }

        function add(x, y) {
            return x + y;
        }
        const number = [4, 354];
        // 函数的调用,使用扩展运算符,该运算符将一个数组变为参数序列
        let a = add(...number);
        console.log(a)

        /* 
            2、替代函数的apply方法
        *****/
        // （1）扩展运算符可以展开数组，所以不需要apply方法将数组转换为函数的参数
        // es5:
        let arr1 = [0, 1, 2, 3];
        let arr2 = [5, 6, 4, 3, 2];
        console.log(arr1.push(...arr2))

        /* 
            3、扩展运算符的应用
        *****/
        // （1）复制数组:复合数据类型,直接复制只是复制了指向底层数据结构的指针,而不是复制一个全新的数组
        const a1 = [1, 2, 3];
        const a2 = a1;
        // a2[0]=20;
        // a2并不是a1克隆的,而是指向同一份数据的另一个指针,修改a1时a1也会跟着改变
        a1; //20, 2, 3

        // 解决方法:es5
        const a3 = a1.concat();
        // 修改a3的同时不会改变a1
        a3[0] = 20;
        a1 //[1, 2, 3]
        // es6:克隆方法(2种)
        const a4 = [...a1];
        const [...a5] = a1;

        /* （2）合并数组*/
        const array1 = [1, 2];
        const array2 = ['zhou', 'zhou'];
        const array3 = ['z', 'zou'];
        // es5
        array1.concat(array2)
        // es6
        console.log([...array1, ...array2,...array3])
    </script>
</html>

猜你喜欢