How object destructuring assignments work?

Question

How could this statement assigns?

var { AppRegistry, View, StyleSheet, ListView } = React;

possible duplicate of [Variable declaration in reactjs documentation](http://stackoverflow.com/questions/30290963/variable-declaration-in-reactjs-documentation) — vkurchatkin, May 18 '15 at 10:33

score 2 · Accepted Answer · answered May 18 '15 at 05:58

This is destructuring assignment that is coming in ECMAScript 6.

var s = { a: 1, b: 2 }
var { a, b } = s;

will assign 1 to a and 2 to b.

Presumably, React is an object that has properties AppRegistry, View etc., and their values are being assigned to variables with the same name.

This syntax is, at the moment of this answer, not yet widely available.

score 1 · Answer 2 · answered Jun 03 '15 at 20:03

This is a new feature in ES6 as Amadan said. ES6 will be released soon and all modern browsers will support it eventually. A lot of projects use Babel together with webpack to compile code to ES5 synatax so that it can be used on any browsers.

React native have their own transforms which support part of ES6:

https://facebook.github.io/react-native/docs/javascript-environment.html#content

So you don't need Babel and webpack if you are using their packager. In the future version facebook may use Babel as well.

How object destructuring assignments work?

2 Answers2