Sunday, May 12, 2024
 Popular · Latest · Hot · Upcoming
164
rated 0 times [  170] [ 6]  / answers: 1 / hits: 17601  / 10 Years ago, tue, november 18, 2014, 12:00:00

I haven't seen this syntax before and am wondering what it's all about.



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


The brackets on the left are throwing a syntax error:




unexpected token {




I'm not sure what part of the webpack config is transforming or what the purpose of the syntax is. Is it a Harmony thing? Can someone enlighten me?


More From » webpack

 Answers
28

It's called destructuring assignment and it's part of the ES2015 standard.




The destructuring assignment syntax is a JavaScript expression that
makes it possible to extract data from arrays or objects using a
syntax that mirrors the construction of array and object literals.



Source: Destructuring assignment reference on MDN




Object destructuring



 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;

[#68776] Friday, November 14, 2014, 10 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
daren

Total Points: 577
Total Questions: 114
Total Answers: 120

Location: Malaysia
Member since Fri, Dec 3, 2021
2 Years ago
daren questions
Wed, May 12, 21, 00:00, 3 Years ago
Wed, Nov 27, 19, 00:00, 5 Years ago
Thu, Oct 17, 19, 00:00, 5 Years ago
;