Javascript - 使用花括号在变量声明中给对象属性分配多个变量

Question

在查看Mozilla（Firefox）Add-on SDK的一些JavaScript代码时，我看到了一种变量声明方式，这是我以前没有见过的：

var { foo, bar } = someFunction("whatever");  // just an example

看到变量名周围有那些花括号了吗？事实证明，这是一种将对象属性的值一次性分配给多个变量的方法。它似乎类似于解构赋值或 PHP 的list，只不过是针对对象属性而不是数组。

我实际上是通过一些摸索发现了这个功能，因为似乎没有任何文档记录它。看一下这段代码：

function gimmeAnObject() {
    return {
        foo: "hey",
        bar: "sup"
    };
}

console.log(gimmeAnObject()); // Object { foo="hey", bar="sup" }

var { foo, bar } = gimmeAnObject();

console.log(foo); // hey
console.log(bar); // sup

我还发现这只在Firefox中能够运行。而在Chrome中会抛出错误：“Uncaught SyntaxError: Unexpected token {”。这就解释了为什么在我开始查看Firefox附加组件代码之前我从未见过它。

有其他人看到过这种变量声明吗？为什么我找不到任何相关的文档呢？由于它只能在Firefox上运行，我认为这可能是Mozilla的东西，但即使在MDN上也找不到任何信息。再说，也许我不知道该搜索什么。

- grant

---

可能是使用块进行常量声明的重复问题。 - Wladimir Palant

在撰写自己的几乎相同的问题时，发现了这个问题 :) - Motti

Answer 1

看着“解构赋值”链接（例如http://en.wikipedia.org/wiki/JavaScript_syntax#Assignment和http://dailyjs.com/2011/09/12/destructuring/），这个结构似乎就是解构赋值。

维基百科：

在Mozilla的JavaScript中，从1.7版本开始，解构赋值允许同时将数据结构的几个部分分配给多个变量。赋值的左侧是一个模式，类似于任意嵌套的对象 / 数组文字，其中包含要接收分配值的l-values的子结构。

在JavaScript中，数组和对象差不多，因此支持数组的结构也适用于对象。

- Alexei Levenkov

---

哦，看起来你是对的。不过我想知道为什么这方面的文档这么少呢？可能除了 Mozilla 之外，没有人认识到解构赋值的用处吧。 - grant

Answer 2

你不能这样做。你必须给变量命名并像这样做：

var myObj = (function(){
    return {
        foo: 'foo',
        bar: 'bar'
    };
})();

- Danilo Valente

---

你可能会这样认为，但在Firefox中似乎可以。尝试在打开控制台的情况下在Firefox中运行我发布的jsFiddle链接。 - grant

也许Firefox更加宽容，或者它有自己的实现方式使其允许这种情况。但我猜测这个声明不符合Web标准。 - Danilo Valente

它正在被添加到Web标准中。请等待几年。 ;) - Boris Zbarsky