Square bracket notation for JavaScript objects: using assignment on the left ({ Navigation } =)
P粉964682904
P粉964682904 2023-08-24 17:31:38
0
2
286
<p>I haven't seen this syntax before and would like to know what it means. </p> <pre class="brush:php;toolbar:false;">var { Navigation } = require('react-router');</pre> The curly brace on the left of <p> will cause a syntax error: </p> <blockquote> <p>unexpected token {</p> </blockquote> <p>I'm not sure which part of the webpack configuration does the conversion, or what the purpose of this syntax is. Is this a Harmony thing? Can someone explain this to me? </p>
P粉964682904
P粉964682904

reply all(1)
P粉578343994

This is destructuring assignment. It is a new feature of ECMAScript 2015.

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

Equivalent to:

var AppRegistry = React.AppRegistry;
var StyleSheet = React.StyleSheet;
var Text = React.Text;
var View = React.View;
P粉350036783

It is called Destructuring assignment and is part of the ES2015 standard .

Object destructuring

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

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

 // 分配新的变量名
 var {p: foo, q: bar} = o;

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

Array destructuring

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

// 不使用解构
var one   = foo[0];
var two   = foo[1];
var three = foo[2];

// 使用解构
var [one, two, three] = foo;
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!