分配左侧的Javascript对象括号表示法（{导航} =）

我以前没有看过这个语法，所以想知道这是什么意思。 左边的方括号出现语法错误：“unexpected token {”

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

我不确定webpackconfiguration的哪个部分正在转换，或者语法的目的是什么。 这是和谐的事情吗？ 有人可以启发我吗？

Answer 1

这就是所谓的解构分配 ，它是ES2015标准的一部分。

解构赋值语法是一个JavaScriptexpression式，它可以使用反映数组和对象文字构造的语法从数组或对象中提取数据。

来源： MDN上的解构赋值引用

对象解构

  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; 

Answer 2

这是解构赋值 。 这是ECMAScript 2015的新function。

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

相当于：

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

Answer 3

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

…使用解构来实现与…相同的事物

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

…但更具可读性

Answer 4

这是ES6中的一个新function来解构对象。

大家都知道这里有一个赋值操作，这意味着右边的值被赋值给左边的variables。

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

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

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

如果我们想在返回的对象中使用一个关键字，那么我们可以使用Object来破坏这个variables。

这只有在我们拥有钥匙的情况下才有可能。

所以，在赋值语句之后，局部variablesNavigation将包含function a(){}

另一个例子是这样的。

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