Javascript - 在变量声明中使用大括号将多个变量赋值给对象属性 [英] Javascript - Assigning multiple variables to object properties using curly braces in variable declaration

问题描述

$ b

在Mozilla（Firefox）附加SDK中查看一些Javascript代码时，我看到了一种我以前从未见过的变量声明：  var {foo，bar} = someFunction（whatever）; //只是一个例子
  

查看变量名称周围的大括号？事实证明，这是一种将一个对象的属性值同时赋值给多个变量的方法。它类似于解构赋值或PHP的 list ，除与对象属性，而不是数组。

我实际上通过一些摆弄发现这一点，因为似乎没有文件。看看这段代码：

 函数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会抛出一个错误：未捕获的SyntaxError：意外的标记{。这解释了为什么我在开始查看Firefox附加代码之前没有看到它。

有没有其他人看过这种变量声明？为什么我找不到任何文档？由于它只能在Firefox中起作用，所以我认为这可能是一个Mozilla的事情，但是我甚至在MDN上甚至找不到它。看看解构分配的链接（即<解析方法>），然后再解释一下，或者我只是不知道要搜索什么。

a href =http://en.wikipedia.org/wiki/JavaScript_syntax#Assignment> http://en.wikipedia.org/wiki/JavaScript_syntax#Assignment 和http://dailyjs.com/2011/09/12/destructuring/ ）它看起来像这个构造是解构赋值。

维基百科：

在Mozilla的JavaScript中，从版本1.7开始，解构赋值允许一次将数据结构的一部分分配给多个变量。赋值的左边是一个类似于任意嵌套的对象/数组文本的模式，在它的叶子处包含l-lvalues，用来接收赋值的子结构。

在JavaScript中，数组和对象或多或少都是相同的，所以支持数组的构造也支持对象也就不足为奇了。

While looking at some Javascript code for Mozilla's (Firefox) Add-on SDK, I saw kind of variable declaration I hadn't seen before:

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

See those curly braces around the variable name? Turns out, this is a way of assigning the values of properties of an object to multiple variables all at once. It seems similar to destructuring assignment or PHP's list, except with object properties instead of arrays.

I actually found this out through some fiddling, since there appears to be no documentation on it. Take a look at this code:

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

I also found that this only works in Firefox. Chrome will instead throw an error: "Uncaught SyntaxError: Unexpected token {". That explains why I hadn't seen it before I started looking at Firefox add-on code.

Has anyone else seen this kind of variable declaration before? Why can't I find any documentation on it? Since it only works in Firefox, I'd think it might be a Mozilla thing, but I couldn't even find anything about it on MDN. Then again, maybe I just didn't know what to search for.

解决方案

Looking at "Destructuring Assignment" links (i.e. http://en.wikipedia.org/wiki/JavaScript_syntax#Assignment and http://dailyjs.com/2011/09/12/destructuring/) it looks like this construct is destructuring assignment.

Wikipedia:

In Mozilla's JavaScript, since version 1.7, destructuring assignment allows the assignment of parts of data structures to several variables at once. The left hand side of an assignment is a pattern that resembles an arbitrarily nested object/array literal containing l-lvalues at its leafs which are to receive the substructures of the assigned value.

In JavaScript arrays and objects are more or less the same so it is not very surprising that construct supported for arrays is also supported for objects.

这篇关于Javascript - 在变量声明中使用大括号将多个变量赋值给对象属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！