Points of attention in es6's learning and deconstruct in es6's Learning
Preface
This article mainly introduces some things that need to be paid attention to during es6 deconstruct and shares them for your reference. I will not talk about them much below. Let's take a look at the detailed introduction.
Be very careful if you want to use a declared variable for deconstruct assignment.
// Incorrect syntax let x; {x }={ x: 1}; // SyntaxError: syntax error
The above code writing method will report an error, because the JavaScript engine will understand {x} as a code block, resulting in a syntax error. This problem can be solved only when you do not write braces at the beginning of the line and avoid JavaScript interpreting them as code blocks.
// Let x; ({x }={ x: 1 });
If the variable name is different from the attribute name, it must be written as follows.
Var {foo: baz} = {foo: 'aaa', bar: 'bbb'}; baz // "aaa" let obj = {first: 'hello', last: 'World'}; let {first: f, last: l} = obj; f // 'hello' l // 'World' // This actually describes, let {foo: foo, bar: bar }={ foo: "aaa", bar: "bbb "};
That is to say, the internal mechanism of the object's deconstruct and value assignment is to first find the attribute with the same name and then assign it to the corresponding variable. The latter is actually assigned, not the former.
let { foo: baz } = { foo: "aaa", bar: "bbb" };baz // "aaa"foo // error: foo is not defined
let obj = { p: [ 'Hello', { y: 'World' } ]};let { p: [x, { y }] } = obj;x // "Hello"y // "World"
Note:P is the mode, not a variable, so it is not assigned a value. If p also needs to be assigned a value as a variable, it can be written as follows.
let obj = { p: [ 'Hello', { y: 'World' } ]};let { p, p: [x, { y }] } = obj;x // "Hello"y // "World"p // ["Hello", {y: "World"}]
During deconstruct assignment, if the right side of the equal sign is a value or a Boolean value, it is first converted to an object.
let {toString: s} = 123;s === Number.prototype.toString // truelet {toString: s} = true;s === Boolean.prototype.toString // true
You can also use deconstruct to assign values to function parameters.
function add([x, y]){ return x + y;}add([1, 2]); // 3
In the code above, the parameter added by the function is an array on the surface, but at the moment the parameter is passed in, the array parameter is parsed to form the variables x and y. For the code inside the function, the parameters they can feel are x and y.
Undefined triggers the default value of the function parameter.
[1, undefined, 3].map((x = 'yes') => x);// [ 1, 'yes', 3 ]
Summary
The above is all the content of this article. I hope the content of this article will help you in your study or work. If you have any questions, please leave a message, thank you for your support.