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

javascript firefox firefox-addon

2022-08-30 00:41:50

编辑在查看JSHint之后，我发现这个“解构表达式”在ES6（使用esnext选项）或Mozilla JS扩展（使用moz）中可用，但是在阅读之后，我仍然不明白为什么使用它

我在MDN上遇到了以下代码

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

第二行上的大括号有什么作用，为什么使用它们？为什么第一行没有大括号？

答案 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兼容性表进行跟踪。

答案 2