ES6语法基础之变量解构赋值(数组)

时间:2022-06-08
本文章向大家介绍ES6语法基础之变量解构赋值(数组),主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

ES6变量解构赋值,看下数组与es5等区别,ES6的新特性大大节省了代码量,使代码可读性大大提高!

数组声明对比

//ES5下数组声明的集中方式        
        var a=5,b=3,c=0;
        var arr=[a,b,c];
        console.log(arr)
        //ES6下数组声明简单多了
        var [x,y,z]=[7,8,9];//下标和值需要一一对应
        console.log('z:'+z);

另类的数组声明方式

//缺位的的对应也是可以的    
    var [n,,m]=[2,5,8];
    console.log("n:"+n);
    console.log("m:"+m);
    //另一种组合方式
    var [t,[a,g]]=[0,[3,5]];
    //泛指(除了对应的数组下标,其他全部组合赋值);
    var [a,...b]=[1,2,3,4,5,0];//a的对应1,..b对应其他
    console.log("a:"+a);
    console.log("b:"+b);//除了a对应的值,之外全部赋予b

ES6数组下标默认值解决

//数组指定默认值  下标(左侧),指定=="默认值",如果有对应值则被赋值,否则则是默认值    
    var [a,b,c="null",d="null"]=[1,0,5];
    console.log("c:"+c);
    console.log("d:"+d);

ES6和ES5解决数组元素默认值对比

     //es6解决默认值问题
    var arr=[1,2,3];
    var [a,b,c="null",d="null"]=arr;
    //es5解决默认值
    var a=arr[0];
    var b=arr[1];
    var c=arr[2];
    var d=arr[3];
    if(arr[3]){
    	d=arr[3];//arr[3]存在不,存在赋予d,否则给予默认值
    }else{
    	d="null";
    }

以上就是ES6变量解构赋值的数组部分,接下来介绍变量解构赋值的对象部分!