物体解构

 var o = {p: 42, q: true};
var {p, q} = o;


console.log(p); // 42
console.log(q); // true


// Assign new variable names
var {p: foo, q: bar} = o;


console.log(foo); // 42
console.log(bar); // true

数组解析

var foo = ["one", "two", "three"];


// without destructuring
var one   = foo[0];
var two   = foo[1];
var three = foo[2];


// with destructuring
var [one, two, three] = foo;

小开

这是破坏性转让，是 ECMAScript 2015的一个新特性。

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

相当于:

var AppRegistry = React.AppRegistry;
var StyleSheet = React.StyleSheet;
var Text = React.Text;
var View = React.View;

小开

这是 ES6中的一个新特性，用于解构对象。

我们都知道这里有一个赋值操作，这意味着右边的值被赋给了左边的变量。

var { Navigation } = require('react-router');

在这种情况下，require('react-router')方法返回一个键-值对对象，类似于:

{ Navigation: function a(){},
Example1: function b(){},
Example2: function c(){}
}

如果我们想在返回的对象中取一个键，比如说 Navigation到一个变量，我们可以使用物体解构。

只有我们手上有钥匙，这才有可能。

因此，在赋值语句之后，局部变量 Navigation将包含 function a(){}

另一个例子如下所示。

var { p, q } = { p: 1, q:2, r:3, s:4 };
console.log(p) //1;
console.log(q) //2;

小开

var { Navigation } = require('react-router');

利用解构来达到和..。

var Navigation = require('react-router').Navigation;

但更容易读懂。

小开

而不是

const salary = personnel.salary
const sex = personnel.sex
const age = personnel.age

很简单

const {salary, age, sex} = personnel

分配左侧的 Javascript 对象括号符号({导航} =)

物体解构

数组解析