围绕javascript变量名称的{花括号}是什么意思

Question

编辑 看着JSHint后,我发现这个" 解构表达"是ES6提供(使用esnext选项)或Mozilla JS扩展(使用MOZ)和本 看完后却我还是不明白为什么它被用来

我在MDN上遇到了以下代码

var ui = require("sdk/ui");
var { ActionButton } = require("sdk/ui/button/action");

第二行的大括号是什么以及为什么使用它们？为什么第一行没有括号？

Answer 1

这就是所谓的解构赋值,它是JavaScript 1.7(和ECMAScript 6)的一个新特性(目前,仅在FireFox JavaScript引擎中可用.)粗略地说,它将转化为:

var ActionButton = require("sdk/ui/button/action").ActionButton;

在这个例子中似乎很愚蠢,因为只分配了一个项目.但是,您可以使用此模式一次分配多个变量:

{x, y} = foo;

相当于:

x = foo.x;
y = foo.y;

这也可以用于数组.例如,您可以轻松地交换两个值而不使用临时变量:

var a = 1;
var b = 3;

[a, b] = [b, a];

可以使用kangax的ES6兼容性表跟踪浏览器支持.