什么是解构赋值？
解构赋值允许你使用类似数组或对象字面量的语法将数组和对象的属性值赋给一系列变量。这个语法非常简洁，而且比传统的属性访问更加清晰。
在不使用解构赋值的情况下，访问数组的前三项：
var first = someArray[0]; var second = someArray[1]; var third = someArray[2]; var first = someArray[0]; var second = someArray[1]; var third = someArray[2];
使用解构赋值后，相应的代码变得更简洁和可读：
var [first, second, third] = someArray; var [first, second, third] = someArray;
SpiderMonkey（Firefox 的 JavaScript 引擎）已经支持解构赋值的大部分特性，但还不完全。
数组和可迭代对象的解构赋值
上面我们已经看到了数组解构赋值的例子，该语法的一般形式是：
[ variable1, variable2, ..., variableN ] = array; [ variable1, variable2, ..., variableN ] = array;
这将把数组中对应的项依次赋给 variable1 到 variableN，如果同时需要声明变量，可以在解构表达式前面添加 var，let 或 const 关键字。
var [ variable1, variable2, ..., variableN ] = array; let [ variable1, variable2, ..., variableN ] = array; const [ variable1, variable2, ..., variableN ] = array; var [ variable1, variable2, ..., variableN ] = array; let [ variable1, variable2, ..., variableN ] = array; const [ variable1, variable2, ..., variableN ] = array;
事实上，你还可以嵌套任意的深度：
var [foo, [[bar], baz]] = [1, [[2], 3]]; console.log(foo); // 1 console.log(bar); // 2 console.log(baz); // 3 var [foo, [[bar], baz]] = [1, [[2], 3]]; console.log(foo); // 1 console.log(bar); // 2 console.log(baz); // 3
此外，还可以跳过数组中的某些项：
var [,,third] = ["foo", "bar", "baz"]; console.log(third); // "baz" var [,,third] = ["foo", "bar", "baz"]; console.log(third); // "baz"
你还可以用一个 Rest 表达式来捕获数组中的剩余项：
var [head, ...tail] = [1, 2, 3, 4]; console.log(tail); // [2, 3, 4] var [head, ...tail] = [1, 2, 3, 4]; console.log(tail); // [2, 3, 4]
如果数组越界或访问数组中不存在的项，将得到和通过数组索引访问一样的值：undefined。
console.log([][0]); // undefined var [missing] = []; console.log(missing); // undefined console.log([][0]); // undefined var [missing] = []; console.log(missing); // undefined
注意，数组解构赋值的方式也同样适用于可遍历的对象：
function* fibs() { var a = 0; var b = 1; while (true) { yield a; [a, b] = [b, a + b]; } } var [first, second, third, fourth, fifth, sixth] = fibs(); console.log(sixth); // 5 function* fibs() { var a = 0; var b = 1; while (true) { yield a; [a, b] = [b, a + b]; } } var [first, second, third, fourth, fifth, sixth] = fibs(); console.log(sixth); // 5
对象的解构赋值
对象的解构赋值允许你将变量绑定到对象不同的属性值。指定被绑定的属性名，后面紧跟要绑定的变量：
var robotA = { name: "Bender" }; var robotB = { name: "Flexo" }; var { name: nameA } = robotA; var { name: nameB } = robotB; console.log(nameA); // "Bender" console.log(nameB); // "Flexo" var robotA = { name: "Bender" }; var robotB = { name: "Flexo" }; var { name: nameA } = robotA; var { name: nameB } = robotB; console.log(nameA); // "Bender" console.log(nameB); // "Flexo"
当绑定的属性名和接收属性值的变量名一样时，还有一个语法糖：
var { foo, bar } = { foo: "lorem", bar: "ipsum" }; console.log(foo); // "lorem" console.log(bar); // "ipsum" var { foo, bar } = { foo: "lorem", bar: "ipsum" }; console.log(foo); // "lorem" console.log(bar); // "ipsum"
与数组一样，也可以嵌套：
var complicatedObj = { arrayProp: [ "Zapp", { second: "Brannigan" } ] }; var { arrayProp: [first, { second }] } = complicatedObj; console.log(first); // "Zapp" console.log(second); // "Brannigan" var complicatedObj = { arrayProp: [ "Zapp", { second: "Brannigan" } ] }; var { arrayProp: [first, { second }] } = complicatedObj; console.log(first); // "Zapp" console.log(second); // "Brannigan"
解构一个不存在的属性时，将得到 undefined：
var { missing } = {}; console.log(missing); // undefined var { missing } = {}; console.log(missing); // undefined
使用对象的解构赋值时还有一个潜在的陷阱，在解构赋值时没有声明变量（没有 var、let或 const 关键字）：
{ blowUp } = { blowUp: 10 }; // Syntax error { blowUp } = { blowUp: 10 }; // Syntax error
这是因为 JavaScript 语法告诉引擎任何以 { 开始的语句都是语句块（例如，{console} 就是一个合法的语句块），解决方法是将整个语句用一对括号包裹：
({ safe } = {}); // No errors ({ safe } = {}); // No errors
其他情况
当你尝试解构 null 或 undefined，你将得到类型错误：
var {blowUp} = null; // TypeError: null has no properties var {blowUp} = null; // TypeError: null has no properties
不过，你可以对其他基本类型（Boolean、String 和 Number）进行解构，将得到 undefined：
var {wtf} = NaN; console.log(wtf); // undefined var {wtf} = NaN; console.log(wtf); // undefined