Saya belum pernah melihat sintaks ini sebelumnya dan saya bertanya-tanya tentang apa itu semua.

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

Tanda kurung di sebelah kiri menampilkan kesalahan sintaks:

token tak terduga {

Saya tidak yakin bagian mana dari konfigurasi webpack yang berubah atau apa tujuan sintaksnya. Apakah itu hal Harmoni? Bisakah seseorang mencerahkan saya?

Ini disebut tugas penghancuran dan itu bagian dari standar ES2015 .

Sintaks tugas penghancuran adalah ekspresi JavaScript yang memungkinkan untuk mengekstrak data dari larik atau objek menggunakan sintaks yang mencerminkan konstruksi larik dan literal objek.

Sumber: Referensi tugas penghancuran di MDN

Perusakan objek

 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

Array destructuring

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;

Ini adalah tugas yang merusak . Ini adalah fitur baru ECMAScript 2015.

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

Apakah setara dengan:

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

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

... menggunakan perusakan untuk mencapai hal yang sama seperti ...

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

... tetapi jauh lebih mudah dibaca.

Ini adalah fitur baru di ES6 untuk merusak objek.

Seperti yang kita semua tahu bahwa ada operasi penugasan yang terjadi di sini, Yang berarti nilai sisi kanan ditugaskan ke variabel sisi kiri.

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

Dalam kasus ini require('react-router')metode mengembalikan objek dengan pasangan nilai kunci beberapa hal seperti

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

Dan jika kita ingin mengambil satu kunci di objek yang dikembalikan, katakan Navigation ke variabel, kita bisa menggunakan Object destructing untuk itu.

Ini hanya akan mungkin hanya jika kita memiliki pegangan kunci.

Jadi, setelah pernyataan penugasan, variabel lokal Navigationakan berisifunction a(){}

Contoh lain terlihat seperti ini.

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