“Deconstructed assignment” in ES6

  • For objects and arrays, the left side of the definition and the right side of the value of similar structure, so that the declaration of several variables, quickly get the information of each part.

Array destruct assignment

let arr = [10, 20, 30, 40]; let [x, y] = arr; Console. log(x, y); console.log(x, y); / / 10 20Copy the code

The result is:

/ / "..." Let arr = [10, 20, 30, 40]; let arr = [10, 20, 30, 40]; let [x, ...y] = arr; console.log(x, y); / / 10,30,40 [20]Copy the code

The result is:

let arr = [10, 20, 30, 40]; let [, , x, y] = arr; 30,40 console.log(x, y); / / 30 to 40Copy the code

The result is:

let arr = [10, 20, 30, 40]; let [, , , x, y = 0] = arr; console.log(x, y); //40 0 "y=0" if y does not exist, we assign a default value to it, otherwise it is undefinedCopy the code

The result is:

Requirements: Variables exchange values, a and B exchange values

let a = 10; let b = 20; let c = a; a = b; b = c; console.log(a, b); / / 20 10Copy the code

The result is:

The second method is:

let a = 10; let b = 20; a = a + b; //30 b = a - b; //10 a-b = a-b; Console. log(a, b); //20 a = b;Copy the code

The result is:

let a = 10; let b = 20; [b, a] = [a, b]; [10,20] console.log(a, b);Copy the code

The result is:

Object

Let obj = {name: 'cloud ', age: 11, teacher:' cloud ', 0: 100}; Let {name, age} = obj;} let {name, age} = obj; Console. log(name, age); Name, age "cloud",11Copy the code

The result is:

I want to declare a variable x to take the value of name in obj

Let obj = {name: 'cloud ', age: 11, teacher:' cloud ', 0: 100}; //let {x} = obj; //console.log(x); Let name = 'xx'; let name = 'xx'; let name = 'xx'; Let {name: x} = obj; let {name: x} = obj; console.log(x); // "cloud", declare a variable of x equal to obj. Name, "Rename during deconstructing: arbitrarily declare a variable to get the value of the specified member in the object"Copy the code

The result is:

How to deconstruct the property name 0 in obj? The number cannot be directly used as the variable name.

  • For numeric property names, we simply rename a new variable to receive the value
Let obj = {name: 'cloud ', age: 11, teacher:' cloud ', 0: 100}; let { 0: x } = obj; console.log(x); / / = > 100Copy the code

The result is:

Requirement: Get the value of class, name and math score in the current data, and spell it into a string “Math score of xx classmate of XX class: XX”

  • The first way is to take it little by little
Let data = [1001, 'elite A ', {name:' cloud ', age: 25, score: [98, 100, 89]; let className = data[1]; Let baseInfo = data[2]; Let name = baseinfo.name; Let score = baseinfo.score; Let math = score[1]; Console. log(' ${className} ${name} ${className} ${math} score ');Copy the code

The result is:

  • The second method: use deconstruction to assign values
Let data = [1001,' elite A ', {name: 'cloud ', age: 25, score: [98, 100, 89]; Let [, className, {name, score: [, math] // define the math variable to get the second value of the score array}] = data; Console. log(' ${className} ${name} ');Copy the code

The result is: