ES6学习之变量的解构赋值
变量的解构赋值
ES6中允许按照一定模式，从数组和对象中提取，对变量进行赋值。
数组的解构赋值
var[a,b,c]=[1,2,3]; a//1; b//2; c//3;
上面的代码标示可以从数组中提取值，按照位置的对应关系对变量进行赋值。
本质上，这种写法属于“模式匹配”，只要等号两边的模式相同，左边的变量就会被赋予对应的值。
let[foo,[[bar],baz]]=[1,[[2],3]]; foo//1; bar//2; baz//3; let[,,third]=['foo','bar','baz']; third//'baz' let[head,...tail]=[1,2,3,4] head//1; tail//[2,3,4]
如果解构不成功，变量的值就等于undefined。
let[x,y,z]=['a'] x//'a'; y//undefined z//[]
不完全解构
如果等号左边的模式只匹配等号右边数组的一部分，解构依然可以成功，这种情况叫做不完全解构。
let[x,y]=[1,2,3] x//1 y//2
如果等号右边不是数组，那么将会报错。（不具备可遍历的结构）。
只要某种数据结构具有Iterator接口，都可以采用数组形式的解构赋值
function*fibs(){
vara=0;
varb=1;
while(true){
yielda;
[a,b]=[b,a+b];
}
}
var[first,second,third,fourth,fifth,sixth]=fibs();
sixth//5
fibs是一个Generator函数，原生具有Iterator接口，解构赋值会依次从这个接口获取值。
默认值
解构赋值允许指定默认值。
var[foo=true]=[]; foo//true
ES6内部使用严格相等于运算符(===)判断一个位置是否有值。所以，一个数组成员如果不严格等于undefined，默认值便不会生效。
var[x=1]=[undefined] x//1 var[x=1]=[null] x//null
表达式也可以作为默认值，如果表达式作为默认值的时候，该表达式是惰性求值的，只有在用到的时候才会求值。
functionf(){
console.log('aaa')
}
let[x=f()]=[1]
在上面的代码中，函数f不会执行，是因为x能取到值。
默认值可以引用解构赋值的其他变量，但该变量必须已经声明。
对象的解构赋值
解构赋值可以应用在数组上，同样也可以用于对象。
var{foo,bar}={foo:'aaa',bar:'bbb'}
foo//'aaa'
bar//'bbb'
对象的解构赋值与数组有一个不同点，就是数组的元素是按次序排序的，变量的取值由它的位置决定，而对象的属性没有次序，变量必须与属性同名，才能取到正确的值。
var{bar,foo}={foo:'aaa',bar:'bbb'}
foo//'aaa'
bar//'bbb'
var{baz}={foo:'aaa',bar:'bbb'}
baz//undefined
如果变量名与属性名不一致，那必须写成这样：
var{foo:baz}={foo:'aaa'}
baz//'aaa'
实际上对象的解构赋值是以下的形式简写：
var{foo:foo,bar:bar}={foo:'aaa',bar:'bbb'}
对象的解构赋值的内部机制，是先找到同名属性，然后再赋给对应的变量，真正被赋值的是后者，而不是前者。
但是，采取上面的写法时，变量的声明和赋值是一起的，对于let和const而言，变量不能重新声明，所以一旦赋值的变量以前声明过，就会报错。
对象的解构也可以用于嵌套结构的对象。
varobj={
p:[
'hello',
{
y:'world'
}
]
}
var{p:[x,{y}]}=obj
x//'hello'
y//'world'
这时p是模式，不是变量，因此不会被赋值。
对象的解构赋值也可以指定默认值，默认值的生效条件是，对象的属性值严格等于undefined。
var{x=3}={x:undefined}
x//3
var{x=3}={x:null}
x//null
如果解构模式是嵌套对象，而且子对象所在的父属性不存在，那么将会报错。
var{foo:{bar}}={baz:'baz'}
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家学习或者使用ES6能带来一定的帮助，如果有疑问大家可以留言交流。