Что означает {фигурные скобки} вокруг имени переменной javascript

ИЗМЕНИТЬ Посмотрев на JSHint, я обнаружил, что это выражение деструктурирования доступно в ES6 (используйте опцию esnext) или расширения Mozilla JS (используйте moz) и this, однако после прочтения я до сих пор не понимаю, почему он используется

Я встретил следующий код на MDN

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

Что делают фигурные скобки во второй строке и почему они используются? Почему в первой строке нет скобок?

Ответ 1

Это то, что называется назначение деструкции, и это новая функция JavaScript 1.7 (и ECMAScript 6) (В настоящее время доступно только в JavaScript-движке FireFox.) Примерно он будет переведен в это:

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];

Поддержка браузера можно отслеживать с помощью таблицы совместимости ES6 для kangax.