ES6数组的解构赋值( 下)

对象的解构赋值 

对象的解构赋值跟数组的解构赋值很类似,我们来看一段小代码:

 var { a,b,c} = {"a":1,"b":2,"c":3};
    console.log(a);//结果:a的值为1    
    console.log(b);//结果:b的值为2
    console.log(c);//结果:c的值为3

     这段例子的代码是不是跟数组的解构赋值很相似,只不过是数组换成了对象。但是两者有一个不同的地方,我们对上面的代码稍做修改:

   var { a,b,c } = {"a":1,"c":3,"b":2};
    console.log(a);//结果:a的值为1
    console.log(b);//结果:b的值为2
    console.log(c);//结果:c的值为3

  

我把右侧的对象属性b和属性c的位置进行了调换,但这并不会影响赋值的结果,变量b和变量c的值不会改变,依然是b为2,c为3。这就告诉我们对象的解构赋值不会受到属性的排列次序影响(数组则会受影响),它是跟属性名关联起来的,变量名要和属性名一致,才会成功赋值。

  如果变量找不到与其名字相同的属性,就会赋值不成功,如下面的例子:

    var { a } = {"b":2};
    console.log(a);//结果:a的值为undefined

 变量a在右侧找不到与之名字匹配的属性a,所以变量a赋值不成功,a的值为undefined。

 但也不是完全没有办法补救的,如果你想给一个变量名与属性名不一样的变量解构赋值,可以这样写:

    var { b:a,} = {"b":2};
    console.log(a);//结果:a的值为2

  

posted on 2017-08-02 23:24  queena_w  阅读(82)  评论(0编辑  收藏  举报

导航