ES6 扩展运算符的应用

(1)复制数组

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

    //复制数组
    const a1 = [1,2];
    const a2 = a1;

    a2[0] = 3;
    console.log(a1); //[3,2]

上面代码中,a2并不是a1的克隆,而是指向同一份数据的另一个指针。修改a2,会直接导致a1的变化。

ES5 只能用变通方法来复制数组

    //ES5 只能用变通方法来复制数组
    const a3 = [1,2];
    const a4 = a3.concat(); //concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。

    a4[0] = 4;
    console.log(a3);  //[1,2]
    console.log(a4);  //[4,2]

上面代码中,a1会返回原数组的克隆,再修改a2就不会对a1产生影响。

ES6扩展运算符提供了复制数组的简写方法

    const a5 = [1,2];
    //写法1
    const a6 = [...a5];
    console.log(a6); //[1,2]
    a6[0] = 3;
    console.log(a6); //[3,2];
    console.log(a5); //[1,2]

    //写法2
    const [...a6] = a5;
    console.log(a6); //[1,2];
    a6[0] = 4;
    console.log(a6);  //[4,2]
    console.log(a5); //[1,2]

(2)合并数组

扩展运算符提供了数组合并的新写法。

    //ES5方式
    var arr1 = [1,2];
    var arr2 = [3,4];
    console.log(arr1.concat(arr2)); //[1,2,3,4]

    //ES6方式
    let arr3 = [1,2];
    let arr4 = [3,4];
    console.log([...arr3,...arr4]); //[1,2,3,4]

 

 

 

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值