ES6解构赋值对象解构与数组解构

数组解构定义

ES6 中允许从数组中提取值，按照对应位置，对变量赋值，对象也可以实现解构。 

数组解构与赋值

ES6以前，为变量赋值，只能直接指定值

let a = 1;
let b = 2;
let c = 3;

 ES6写法

let[a,b,c] = [1,2,3];
console.log(a);//1
console.log(b);//2
console.log(c);//3

上面代码表示，可以从数组中提取值，按照对应位置，对变量赋值。本质上，这种写法属于“模式匹配”，只要等号两边的模式相同，左边的变量就会被赋予对应的值。

多维数组，嵌套

 let arr = [1,[2,3],4];
 let [a,[b,c],d] = arr;
 console.log(a,b,c,d);

 省略参数，后面变为数组

 let arr = [1,2,3,4];
 let [a,b,...c] = arr;
 console.log(a,b,c);

合并数组

let arr1 = [1,2];
let arr2 = [3,4];
let arr3 = [...arr1,...arr2];
console.log(arr3);

  默认值，必须是undefinded默认值才生效

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

let [a,b=2] = [1,undefined];
console.log(a,b);

对象解构

•  根据 key 解构
• 根据 key 更改变量名，当属性没有的时候支持默认值

let Person = {realname:"张三",age:20};
let {realname:myrealname,age,height=180} = Person;
console.log("姓名：" + myrealname,"年龄:"+age,"身高:"+height);

对象的解构与数组有一个重要的不同。数组的元素是按顺序排列的，变量的取值由它的位置决定；而对象的属性没有次序，变量必须与属性同名，才能取到正确的值，否则解构失败就undefined。

对象的解构赋值的内部机制，是先找到同名属性，然后再赋给对应的变量。真正被赋值的是后者，而不是前者。

解构应用

• 变量值交换

let a=1;
let b=2;
[a,b] = [b,a];
console.log(a);

• 函数返回多个值

function myfun(){
return [2,3,4];
}
let [a,b,c] = myfun();

• 函数参数的定义

function myfun([a,b,c]){
console.log(a);
}
myfun([4,5,6]);