解构赋值还有最后一个与变量声明相关的变化，而且该变化是 ECMAScript 6 中最重要的更新之一。解构赋值（destructuring assignment） 允许从一个对象或数组向多个变量赋值。实质上，该操作将数组或对象 “解构” 为它的构成部分。
或许通过操作而不是通过文字才能更好地了解什么是解构。给定一个类似这样的数组
let names = ["Ted", "Jenni", "Athen"];
|
您可以使用变量声明的解构形式，将各个数组元素分解为独立的变量，就像这样：
let [ted, jenni, athen] = names;
console.log(ted, jenni, athen); // prints "Ted Jenni Athen"
|
请注意，数组将变量声明放在括号中。这些括号告诉 ECMAScript，等号右侧需要一个数组。如果数组中的元素比声明的变量要多，那么数组中剩余的元素将被丢弃。（当然，这些值仍在数组中 — 数组的值被复制到变量中，最初的数组不受影响。）如果数组中的值比声明的变量少，ECMAScript 将为所有剩余的变量填入值 “undefined”。
在许多方面，解构赋值的数组形式只是相同操作的旧形式的语法糖：
var ted = names[0];
var jenni = names[1];
var athen = names[2];
|
解构版本更短，而且可能表达得更清楚。
对象中的解构解构赋值的最适用用例之一是，从一次正则表达式解析中提取值：
var url = "http://www.newardassociates.com/#/speaking";
var parsedURL = /^(\w+)\:\/\/([^\/]+)\/(.*)$/.exec(url);
var [, protocol, fullhost, fullpath] = parsedURL;
console.log(protocol); // "http"
|
也可对对象执行类似的解构类型。先给定一个简单对象，然后就可以执行以下类似操作：
let point = { x:2, y: 5 };
let {x, y} = point;
console.log(x, y); // prints 2, 5
|
在这里，解构发生在对象上，并通过在右侧对象中找到同名的变量来绑定变量。也就是说，即使我们以相反顺序编写变量，x 的值仍会收到 point.x，y 仍会收到 point.y：
let point = { x:2, y: 5 };
let {y, x} = point;
console.log(x, y); // prints 2, 5
|
如果出于某种原因，您不关心对象字段名称是否匹配，可以使用字段式语法来重命名字段，左侧表示要匹配的名称，右侧表示实际声明的变量名：
let {y: pty, x: ptx} = point;
console.log(ptx, pty); // prints 2, 5
|
这使您在解构对象时能够对变量命名有更多的控制权。
解构也可以在多个层上发生；例如，矩形通常使用两点来表示：
let rect = { lowerLeft: { x:0, y:0 }, upperRight: { x:3, y:4} };
|
如果您想提取矩形的 4 个值，可以将两个 x/y 对拉入 4 个不同的变量中，就像这样：
let { lowerLeft: { x:llx, y: lly }, upperRight: { x:urx, y:ury } }
= rect;
console.log(llx, lly, urx, ury); // prints "0 0 3 4"
|
在这种情况下，“lowerLeft” 和 “upperRight” 不是实际的变量；它们是占位符，表示其子字段应如何绑定到被解构的对象中具有对应名称的字段。本例中仅实际引入了变量 llx、lly、urx 和 ury。
就目前而言，这些已足以帮助您理解解构了，但我们不会止步于此。在未来的文章中，您将了解如何在方法参数内使用这种新语法。
结束语我们才刚刚开始着手调查 ECMAScript 6 带来的变化，尽管如此，我们已感觉到该语言与之前的版本之间的区别。最新一轮规范具有新的成熟水平，更正了困扰开发人员十年的一些缺陷。
ECMAScript 6 中的一些更改将可直接采用和快速应用，例如，可以轻松开始使用 let 和 const 代替 var。其他变化将需要更多时间来集成，比如重音符字符串语法。幸运的是，所有 ECMAScript 引擎仍向后兼容，所以仍然还有时间进行调整。
谈到时间，我们这里的介绍到底为止了。但在您准备好探索 ECMAScript 6 中的函数更新时，请阅读 。 |
