变量的解构赋值

ES6允许按照一定的模式,从数组或对象中提取值,并对变量进行赋值。等式右边的必须是可迭代对象,否则就会报错。

例如 let [q, w, e] = [1, 2,3], 左右需要对应,如果左边长度大于右边长度,则解构不成功,左边为获取值的变量为undifined。如果右边长度大,则解构成功,

解构是允许赋予默认值,例如

let [a, b =1] = ['a']
b //1

es6中使用严格相等的运算符,如果一个位置上没值即严格等于undefined(null不算)才会使用默认值,例如:

let [x=1] = [2]
x //2

对象的解构

对象的解构是没有次序的,变量必须要跟属性同名,才能取到值:

1 let {aa, bb} = {bb:1, aa :2};
2 aa // 2
3 bb //1
4 
5 let {foo} = {bar :2};
6 foo // undifined
View Code

实际上,对象的解构赋值的内部机制实现找到同名的属性,然后赋值给对应的变量,即冒号左面的匹配模式,右面的是变量或值,例如:

1 let {foo:foo, bar:bar} = {foo:'hello', bar:'world!'};
2 foo // hello
3 bar // world
4 
5 let {foo:bar} = {foo:'hello', bar:'world!'};
6 bar // hello
7 foo //   foo is not defined
View Code

但是需要注意,如果等式左面的是嵌套对象,有面找不到与左面匹配的属性,就会报错:

let {z:{c}} = {c:1};
// Cannot destructure property `v` of 'undefined' or 'null'
View Code

对象解构也有默认值,与数组的解构一样,为严格模式下等于undifined

1 let {x=2} = {};
2 x // 2
3 let{x:y=2} = {x:3};
4 y //3
View Code

对象解构应用数组

1 let arr = [1, 2, 3];
2 let {0:first, [arr.length-1]:last} = arr;
3 first // 1
4 ast //3
View Code

 

posted @ 2019-08-12 11:06  灬灬灬灬灬灬  阅读(136)  评论(0编辑  收藏  举报