Нотация объектов JavaScript кронштейн {навигация} =) на левой стороне назначить


Я не видел этот синтаксис раньше и мне интересно, что это такое.

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

скобки слева выбрасывают синтаксическую ошибку:

неожиданный токен {

Я не уверен, какая часть конфигурации webpack преобразуется или какова цель синтаксиса. Это что-то вроде гармонии? Может кто-нибудь просветить меня?

4 75

4 ответа:

Это называется реструктуризующее присваивание и часть стандартные ES2015.

синтаксис назначения деструктурирования-это выражение JavaScript, которое позволяет извлекать данные из массивов или объектов, используя синтаксис, который отражает построение литералов массива и объекта.

источник:деструктурирование ссылки на назначение 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;

Это реструктуризующее присваивание. Это новая функция ECMAScript 2015.

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

эквивалентно:

var AppRegistry = React.AppRegistry;
var StyleSheet = React.StyleSheet;
var Text = React.Text;
var View = React.View;
var { Navigation } = require('react-router');

... использует деструктурирование для достижения того же самого ...

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

... но гораздо более читабельно.

это новая функция в ES6 для разрушения объектов.

как мы все знаем, что здесь происходит операция присваивания, что означает, что значение правой стороны присваивается переменной левой стороны.

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

в этом случае require('react-router') метод возвращает объект с парой значений ключа что-то вроде

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

и если мы хотели бы взять один ключ в этом возвращенном объекте сказать Navigation переменной мы можем использовать объект разрушение для этого.

это будет возможно только в том случае, если у нас есть ключ inhand.

Итак, после оператора присваивания, локальная переменная Navigation содержит function a(){}

другой пример выглядит так.

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