Deconstruction assignment--The deconstruction assignment of an array

What is a deconstructed assignment? ES6 allows you to extract values from arrays and objects in a certain pattern, assigning values to variables, which is called deconstruction (destructuring). My understanding is that it allows you to declare a pattern (arrays, objects, and so on) that contains one or more variables, and then iterates over those variables (by corresponding positions).

Basic usage of Array deconstruction assignment

Previously, assigning a value to a variable could only be specified directly.

let A = 1;

Let B = 2;

By deconstructing the assigned value:

Let [A, b] = [1, 2]

This is the same as the above statement respectively. From the following array in accordance with the corresponding position assigned to the variable, the allowable value is more than the variable, called the incomplete deconstruction, the part of the more than the tube, if the variable ratio is many, then the deconstruction is not successful, the value of the variable is undefined, such as:

Let [A, B, c] = [1, 2, 3, 4, 5]

A//1 b//2 c//3 and 4,5 is out of control;

Let [A, B, c,] = [1, 2]

A//1 b//2 c//undefined

But there is a situation in which a variable declared with a ... name, although there is no corresponding value, is also assigned a null value (to see the preceding data type, such as an empty array or an empty object):

Let [A, B, ... c] = [1]

A//1 b//undefined c//[]

Essentially, this is a pattern match, as long as the pattern on either side of the equal sign is the same, the left variable is given a corresponding value. Here are some examples of using nested arrays for deconstruction.

Let [A, [[b], c]] = [1, [[2, 3], 4]];

A//1 b//2 c//4

let [,, str] = [' A ', ' B ', ' C ']

STR//' C '

Let [A, ... b] = [1, 2, 3, 4] This ... the form of name is called an extension operator, which is described in more detail later.

A//1 b//[2, 3, 4]

If the right side of the equal sign is not an array (or the deconstruction that cannot be traversed, you need to refer to Iterator), you will get an error, and then learn to write again, let me give you a few examples:

let [a] = 1;

let [a] = false;

let [a] = NaN;

let [a] = undefined;

let [a] = null;

let [a] = {};

All of these will be error, because the value (mode) to the right of the equals sign does not have the Iterator interface (the first 5), or the Iterator interface (the last one).

For the SET structure, you can also use the destructor assignment for the array:

Set structure: ES6 provides a new data structure that resembles an array, but the values of the members are unique and have no duplicate values. The SET function can accept an array (or an array-like object) as an argument for initialization.

let [x, Y, z] = new Set ([' A ', ' B ', ' C ')

X//' A ' Y//' B ' z//' C '

In fact, as long as a data structure has a Iterator interface, it can be used as an array of deconstruction assignment.

function* fibs () {

Let a = 0;

Let B = 1;

while (true) {

Yield A;

[A, b] = [B, a+b];

}

}

Let [Num1, num2, num3, num4, num5] = fibs ();

NUM5//5

In the above code, there fibs is a Generator function, which is native with the Iterator interface. The deconstruction assignment gets the value from this interface in turn. The generator function is described in more detail later.

Default value

The deconstruction assignment allows you to specify a default value. is to assign a value when declaring a variable on the left side of the equation, and the default value will be changed if there is a corresponding position on the right and the default value is different.

let [foo = true] = [];

Foo//true;

let [x, y = ' b '] = [' a '];

X//' A ' Y//' B '

Directly on the left side of the variable equals undefined, the right side of the corresponding position has no value, the resulting will be undefined, if the left has a default value, the face should be the position is undefined, or the default value, will not be replaced by undefined. As mentioned above, if the left side is only declared as an assignment, and there is no corresponding value on the right, the undefined will be taken.

let [x = 1] = [undefined];

x//1;

let [x = 2] = [NULL];

X//null

In the above code, if an array member is null , the default value does not take effect because it is null not strictly equal undefined .

If the default value is an expression, it will be evaluated at the time of use, and the expression is called lazy evaluation.

function f () {

Console.log (' Hello ');

}

let [a = f ()] = [1];

The above code, because a can fetch a value, so the function is not executed.

The default value can refer to other variables that deconstruct the assignment, but the variable must already be declared.

let [x = 1, y = x] = []; x = 1; y = 1;

let [x = 1, y = x] = [2]; x = 2; y = 2;

let [x = 1, y = x] = [2, 3]; x = 2; y = 3;

let [x = y, y = 1] = [1]; Referenceerror, error is defined

In fact, the right side has a value, it will change the value of the variable corresponding to the left position, but the default value but the variable needs to be declared in advance, otherwise it will be an error, that is, the first time the variable appears, can not appear on the right side of ' = ', such as the last.

Deconstruction assignment--The deconstruction assignment of an array