Introduction to ES6 (1)
I suggest you to read Ruan Yifeng's es6 tutorial. It is very comprehensive. You can only understand the properties of es6 in-depth if you have used it in actual projects. Below I will only briefly summarize some of the properties. If you have any shortcomings, please Please correct me, learn together and make progress together!
1, let and const
Compared with var, let and const have a block-level scope and will only be valid within the scope
Why do you need block-level scope?
ES5 has only global scope and function scope, not block-level scope, which brings many unreasonable scenarios.
In the first scenario, inner variables may cover outer variables.
In the second scenario, the loop variable used for counting is leaked as a global variable.
Var has a variable promotion phenomenon
, that is, the variable can be used before the declaration, and the value is undefined. This phenomenon is more or less strange. According to the general logic, variables should be used after the statement statement.
let:
ES6 added the let command to declare variables. Its usage is similar to var, but the declared variable is only valid in the code block where the let command is located.
At the same time, the variables declared by let do not have variable promotion.
When let declares a variable, it cannot be repeated.
const:
const declares a read-only constant. Once declared, the value of the constant cannot be changed.
The scope of const is the same as the let command: it is only valid in the block-level scope of the declaration.
The constant declared by the const command is also not promoted, and there is also a temporary dead zone, which can only be used after the declared position.
It should be noted that the variable declared by const is only declared but not assigned, and an error will be reported.
2. Deconstruction and assignment
ES6 allows extracting values from arrays and objects and assigning values to variables according to a certain pattern, which is called Destructuring.
let [a, b, c] = [1, 2, 3];
Essentially, this type of writing belongs to "pattern matching", as long as the patterns on both sides of the equal sign are the same, the variable on the left will be assigned the corresponding value. Here are some examples of destructuring using nested arrays.
If the deconstruction is unsuccessful, for example, due to the different patterns on the two sides of the equal sign, the value of the variable is undefined; if only part of the data can be matched, the part of the deconstruction will be incomplete deconstruction; if the right side of the equal sign is not an array (or strictly Say, it is not a traversable structure), then an error will be reported.
Destructuring can be applied not only to arrays, but also to objects
There is an important difference between object destructuring and arrays. The elements of the array are arranged in order, and the value of the variable is determined by its position; and the properties of the object have no order, and the variable must have the same name as the property in order to get the correct value.
let {foo: foo, bar: bar} = {foo: “aaa”, bar: “bbb” };
The internal mechanism of object destructuring assignment is to find the attribute with the same name first, and then assign it to the corresponding variable. The latter is actually assigned, not the former.
Variable deconstruction assignment has many uses, exchange variable values; return multiple values from functions; definition of function parameters; extract JSON data; default values of function parameters; traverse the Map structure, you can learn more about it in detail
3、Symbol:
ES6 introduces a new primitive data type Symbol, which represents a unique value. It is the seventh data type of the JavaScript language. The first six are: Undefined, Null, Boolean, String, Number, and Object.
In the above code, the variable s is a unique value. The result of the typeof operator indicates that the variable s is of the Symbol data type, rather than other types such as strings.
Note that the new command cannot be used before the Symbol function, otherwise an error will be reported. This is because the generated Symbol is a primitive value, not an object. In other words, because the Symbol value is not an object, you cannot add attributes. Basically, it is a data type similar to a string.
In fact, it is rarely used in daily work, so I suggest you to find out about it.
I will review this article first. I hope you will study hard and improve your skills. I think you can remember to like it.