[解決済み】javascriptの変数名の周りの{curly braces}の意味は何ですか【重複

質問

EDIT JSHintを見た後、私はこの' ES6 (esnext オプションを使用) または Mozilla JS 拡張 (moz を使用) で使用可能な「構造化式」。 そして これ しかし、それを読んだ後でも、なぜそれが使われるのか理解できない。

で以下のようなコードに出会いました。 MDN

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

2行目の中括弧は何のためにあるのでしょうか？1行目にはなぜ中括弧がないのですか？

どのように解決するのですか？

これは、いわゆる 構造化代入 の新しい機能です。 JavaScript 1.7 (そして ECMAScript 6 ) (現在、FirefoxのJavaScriptエンジンの一部としてのみ利用可能）大雑把に訳すと、こんな感じです。

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

この例では、割り当てられる項目が1つだけなので、馬鹿げているように見えます。 しかし、このパターンを使えば、一度に複数の変数を代入することができます。

{x, y} = foo;

と同等である。

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

これは、配列にも使えます。 例えば、一時的な変数を使わずに、2つの値を簡単に入れ替えることができます。

var a = 1;
var b = 3;

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

ブラウザのサポートは、以下の方法で追跡できます。 kangax' ES6 互換性テーブル .