解构赋值

ES 6 的解构赋值：

1，数组的解构赋值

2，对象的解构赋值

3，字符串的解构赋值

4，数值和布尔值的解构赋值

5，函数参数的解构赋值

数组的解构赋值

let [a,b,c] = [1,2,3];
// a = 1,b = 2,c = 3
let [x,y, ...z] = [1,2,3,4,5];
// x 1,y 2,z [3,4,5]
let [x,y] = [1];
// x 1,y undefined,如果没有对应的值 则为 undefined 
let [foo] = NaN；
// 报错 ，如果右侧不是数组（不可遍历的对象，NaN,false,undefined...），就会报错
let [x,y,z] = new Set(['a','b','c']);
// Set 结构，也可以使用数组的解构赋值 x = 'a'

事实上只要具有 Iterator 接口，都可以采用数组形式的解构赋值

function* fun() {
    yield 'a';
    yield 'b';
}
let [first,second] = fun();
// first = a ,second = b

上面是一个 Generator 函数，原生具有 Iterator 接口，解构赋值会依次从这个接口获取值。

默认值

解构赋值允许设置 默认值

let [val = true] = [];
// val = true

注意： Es6 内部使用严格相等运算符 （===）,判断一个位置是否有值，所以，只有当一个数组成员严格等于 undefined ，默认值才会有效。

let [x = 1] = [undefined];
// x = 1 ，默认值生效
let [x = 1] = [null];
// x = null，因为 null 不全等于 undefined，所以默认值不生效

默认值可以引用解构赋值的其他变量，但是引用之前必须声明

let [x = 1,y = x] = []; // x 1 ,y 1
let [y = x,x = 1] = []; // 报错，因为 x 还未声明，y 就引用了 x

对象的解构赋值

对象解构赋值的特点：

1，匹配没有顺序，变量名必须和属性名同名

2，匹配的 模式 不被赋值

3，可以多次，嵌套赋值

4，可以获取继承属性的值

let {val,val2} = {val:'hello world！'};
// val = hello world !, val2 = undefined

let {val:str} = {val:'hello world!'};
// val = undefined ，val 是匹配的模式，真正要赋值的 str , 所以 str = hello world！

let {val,val:{name},val:{name:str}} = {val:{name: 'Jack'}}
// val = val:{name:'Jack'}, name = 'Jack', str = 'Jack'

默认值

let {x = 3} = {};
// x = 3
let {x: y = 3} = {}
// y = 3

对象解构赋值的注意：

// 如果一个变量已经声明之后，再用这个变量去结构赋值的时候，需要注意写法
let x;
{x} = {x:3} // 报错，这里会把大括号解析为 代码块
// 正确写法，加上括号
({x} = {x:3}) 

// 数组的对象解构
let arr = [1,2,3];
let {0:first,2:last} = arr;
// first = 1, last = 3

字符串的解构赋值

字符串可以解构赋值，因为字符串被转换成了一个类似数组的对象。

const [a,b,c,d,e] = 'hello';
// a = h,b = e,c = l,d = l,e = o

类似数组的对象都有一个 length 属性，可以对这个属性解构赋值

let {length: len} = 'hello';
// len = 5