ES6解构赋值学习总结

ES6提供了解构赋值的方式，这样子在赋值多个变量或者进行注释时可以方便很多，不同场景下也有很多新的应用，个人常使用的有数组的解构赋值，对象的解构赋值和函数参数的解构赋值，函数参数的解构赋值之前总结过，这里写下数组的和对象的简单总结吧
函数参数的解构赋值总结点击这里

一、数组的解构赋值

先来个最简单的

let [a, b] = [1, 2];
a;//输出1
b;//输出2

这种模式就容易为多个变量赋值，因为等号右边是数组，所以有需要获取数组元素时，如下使用更为方便

let array = [1,2,3];
let [a, b, c] = array;
a;//输出1
b;//输出2
c;//输出3

当然，数组中的元素是不限类型的

let [a, array, c] = [1, [2,3], 4];
a;//输出1
array;//输出[2,3]
c;//输出4

另外，可将剩余元素赋值给一个变量

let [a, ...b] = [1,2,3,4];
a;//输出1
b;//输出[2, 3, 4]

其实只要等号右边具有Iterator接口均可使用解构赋值

二、对象的解构赋值

先给个最简单的例子

let {name, sex} = {name:"Jonithan", sex:"male"}
name;//"Jonithan"
sex;//"male"

这里的赋值是变量名对应属性名赋值，如果变量名与属性名没有对应上的话，则会赋值失败，如下所示

let {name, gender} = {name:"Jonithan", sex:"male"}
name;//"Jonithan"
gender;//undefined，因为没有对应属性名

其实以上写法只是如下写法的简写

let {name:name, sex:sex} = {name:"Jonithan", sex:"male"}
name;//"Jonithan"
sex;//"male"

所以其实是把对应的属性名提取出来给一个变量，所以可以这样使用

let {name:username, sex:gender} = {name:"Jonithan", sex:"male"}
username;//"Jonithan"
gender;//"male"

以上仅列出了较为简单的情况，更多具体情况查询MDN吧，或者翻看阮老师的《ES6标准入门》