变量的解构赋值

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

 

转载于:https://www.cnblogs.com/yangshixiong/p/11338535.html