ES6解构赋值

数组的解构赋值

数组的解构赋值需要左边的变量结构需要等于右边的值的结构，即给对应位置的变量声明对应位置的值，变量的取值由位置决定

只要某种数据类型具有迭代器(iterator)接口，就可以使用数组的解构赋值，不一定非是数组

es6中具有iterator接口的数据类型有：数组，类数组对象，字符串，Set，Map，Generator函数

注：对象不具有iterator接口，需要自己配置

var [a,b,c] = ['a','b'];console.log(a); //aconsole.log(b); //bvar [a,[[b],c]] = [1,[[2],3]];console.log(a); //1console.log(b); //2console.log(c); //3//不完全解构，左边只是右边的一部分，但是模式是正确的var [a,,c] = ['a1','b1','c1','d1'];console.log(a); //a1console.log(c); //c1var [a,...b] = ['a2','b2','c2','d2']; //rest参数：...b 获取多余的数组元素，组成一个新数组，常用于函数参数中，作用与arguments类似，arguments是类数组console.log(a); //a2console.log(b); //['b2','c2','d2']var [a,b,...c] = ['a3'];//rest参数必须是最后一个元素console.log(a); //a3console.log(b); //undefined 解构不成功就是undefinedconsole.log(c); //[] rest参数解构不成功是空数组[]//字符串具有iterator接口var [a,b,c] = 'hello';console.log(a); //hconsole.log(b); //econsole.log(c); //lvar [a,b,c] = new Set(['aa','bb','cc']);console.log(a); //aaconsole.log(b); //bbconsole.log(c); //cc

对象的解构赋值

对象的属性没有次序，变量必须与属性同名，才能取到正确的值，即变量名与属性名一一对应，次序不重要

var {foo,bar} = {bar: 'aaa', foo: 'bbb'}console.log(foo); //bbbconsole.log(bar); //aaavar {foo} = {baz: 'ccc'}console.log(foo); //undefined 因为变量与属性名不一致//解决办法//在变量前指定对应的属性名使用：隔开var {baz:foo} = {baz: 'ddd'}console.log(foo); //ddd  foo指向baz属性对应的值//还可以用于嵌套结构对象, 不过应该很少会这么做吧。。。var obj = {  p: [    'Gary',    {      y: 'Guo'    }  ]}var {  p: [    x,    {      y    }  ]} = obj;console.log(x); //Garyconsole.log(y); //Guo

如果是先声明了变量再进行对象解构赋值则需要加上括号，否则js回你认为{}是一个代码块，而不是解构赋值

var bar;{bar} = {bar:1} //SyntaxError: expected expression, got '='console.log(bar);var bar;({bar} = {bar:111})console.log(bar);  //111 实际开发中不推荐这么做

对象解构赋值的小应用：求最大值

//正常方法var arr = [2,5,1,8,4,2];console.log(Math.max.apply(this, arr)); //8//简化var {max} = Math;console.log(max.apply(this, arr)); //8即是将现有方法赋值到变量上使用