admin管理员组文章数量:1323369
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.
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.
Share Improve this question edited Feb 4, 2017 at 21:37 grant asked May 10, 2012 at 0:36 grantgrant 7458 silver badges17 bronze badges 2- possible duplicate of Constant declaration with block – Wladimir Palant Commented May 10, 2012 at 4:46
- 1 Found this question while posing an almost identical question of my own :) – Motti Commented Dec 17, 2014 at 14:42
2 Answers
Reset to default 5Looking at "Destructuring Assignment" links (i.e. http://en.wikipedia/wiki/JavaScript_syntax#Assignment and http://dailyjs./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.
You can't do it. You have to name a var and do something like this:
var myObj = (function(){
return {
foo: 'foo',
bar: 'bar'
};
})();
本文标签:
版权声明:本文标题:firefox - Javascript - Assigning multiple variables to object properties using curly braces in variable declaration - Stack Over 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742123614a2421837.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论