Shulou(Shulou.com)06/02 Report--

This article mainly introduces "what is ES6-related knowledge in JavaScript". In daily operation, I believe many people have doubts about ES6-related knowledge in JavaScript. The editor consulted all kinds of materials and sorted out simple and easy-to-use operation methods. I hope it will be helpful for you to answer the doubts about "what is ES6-related knowledge in JavaScript?" Next, please follow the editor to study!

Let&&const

The difference between [size=0.9em] let and [size=0.9em] var

Let variable name = variable value

The difference between creating variables with let and creating variables with var

1. Variables declared with var will be promoted, while variables declared with let will not be promoted.

Create variables with let

Let xxx=xxx

Create a function with let

Let xxx=function () {}

Create a self-executing function

; (function () {

) ()

2. Defining a variable with let does not allow repeated declaration of a variable in the same scope [size=0.9em] (as long as there is a variable in the current scope, whether it is declared with var or let, and then declared with let, it will report an error: a variable cannot be repeatedly declared), but it can be repeatedly defined (assigned).

Let iTunes 10

Let iTune20 / will report an error

Repeated assignment will not report an error

3. Temporary dead zone: within the code block, the variable cannot be used until the variable is declared using the let command.

If (true) {

/ / TDZ start

Tmp = 'abc'; / / ReferenceError. After an error is reported, the following will not be output

Console.log (tmp); / / ReferenceError, none of the following will be output after an error is reported

Let tmp; / / TDZ ends

Console.log (tmp); / / undefined

Tmp = 123

Console.log (tmp) / / 123

}

/ / TDZ will also be reported as an error below

Console.log (typeof x); / / ReferenceError

Let x

/ / as a comparison, if a variable is not declared at all, using typeof will not report an error.

Console.log (typeof x); / / "undefined"

4. The variable (let) created by ES6 syntax has block-level scope.

[ES5]

Window global scope

Private scope formed by function execution

[ES6]

In addition to the two scopes in ES5, block-level scopes have been added to ES6 (we can think of block-level scopes as private scopes we learned before, and there are some mechanisms for private scopes and scope chains.) [size=0.9em] ES6 calls most of those wrapped in {} block-level scopes.

[size=0.9em] const

The details of const are similar to those of let

The constant declared by const must be assigned as long as it is declared, and the value of the variable is certain and cannot be modified.

[size=0.9em] Note: it is not that the value of the variable cannot be changed, but that the memory address that the variable points to must not be changed. For simple types of data (numeric, string, Boolean), the value is stored at the memory address that the variable points to, so it is equivalent to a constant. But for the compound type of data (mainly objects and arrays), the memory address of the variable points to only a pointer, const can only guarantee that the pointer is fixed, as for whether the data structure it points to is variable, it is completely out of control. Therefore, you must be very careful when declaring an object as a constant.

The variable declared by [size=1em] [size=1em] const also has a temporary dead zone, that is, it can only be used after the declared location.

Summary of how variables are created in JS

[size=1em] [size=1em] [ES5]

Var: creating variabl

Function: create function

Create variables or functions in ES5: there are features such as variable promotion, repeated declaration, etc.

[size=1em] [size=1em] [ES6]

Let create variable

Create constants in const:ES6

Variables or constants created in ES6: there is no variable promotion, no repeated declaration, and there is a block-level scope

Class: create a class

Import: import

Deconstruction assignment in ES6

[size=1em] [size=1em] according to the structure of the original value, a part of the original value is quickly obtained (quickly assigned to a variable).

Deconstruction assignment of array

[size=1em] [size=1em] deconstructing assignment itself is the syntax specification of ES6, it doesn't matter what keywords are used to declare these variables, if not, it is equivalent to adding custom attributes to window; (keywords must be used in strict mode, because variables declared without keywords are not allowed in strict mode;), if the value cannot be deconstructed, then the value of the variable is undefined.

Let [a _

Var [dpene] = [35pr 41pr 63]

Console.log (a _ c _

Console.log (dpene _ r _ f) / / 35 _

[Q _ rect _ w _ e] = [1Q _ 2 ~ 3]; / / it is equivalent to adding three attributes to window: Q _ ~ w, e values of 1 ~ 2 ~ 3 respectively; (error will be reported in strict mode)

The deconstruction assignment of [size=1em] [size=1em] multidimensional array allows us to get the desired results quickly.

Let [a _ r _ b _ r _ c] = [[45 ~ 36], 12, [23 ~ 14], [1 ~ ~ 2 [4, [8] 23 _ 34]

Console.log (a) / / [45,536]

Console.log (b) / / 12

Console.log (c) / / [23, 43, [1, 2, [4, [8]

The values in the array that do not need to be deconstructed can be left blank with a comma (,), and a comma represents an empty term.

Let [, A] = [12jue 235,45]

Console.log (A) / / undefined

Let [, B] = [12dy23] 45]

Console.log (B) / / 45

[size=1em] [size=1em] in deconstructing assignments, the extension operator is supported, that is, [size=1em]. [size=1em], as long as the extension operator is used, a new array or object is generated. If the value cannot be deconstructed, the newly generated array or object is empty, not undefined, but the extension operator must be placed at the end.

Let [a minute. C] = [12 recollection 1pr 4pr 83pr 34]

Console.log (a) / / 12

Console.log (c) / / [1, 4, 4, 83, 34]

Let [a minute. BBME c] = [12 record1, 4, 3, 34]; / / error will be reported, and the extension operator can only be placed at the end.

Deconstruction assignment of object

[size=1em] [size=1em] concise representation of objects:

Const foo = 'bar'

Const baz = {foo}

Baz / / {foo: "bar"}

/ / equivalent to

Const baz = {foo: foo}

The deconstruction of [size=1em] [size=1em] objects differs significantly from arrays. The elements of the array are arranged in order, and the value of the variable is determined by its position; while the attributes of the object are not in order, and the variable must have the same name as the attribute in order to get the correct value.

Let {foo, bar} = {foo: "aaa", bar: "bbb"}

Foo / / "aaa"

Bar / / "bbb"

If the variable name does not match the property name, it must be written as follows.

Let {foo: baz} = {foo: 'aaa', bar:' bbb'}

Baz / / "aaa"

It is the latter, not the former, that is really assigned.

Let obj = {first: 'hello', last:' world'}

Let {first: F, last: l} = obj

F / / 'hello'

L / / 'world'

First//error: first is not defined

If you want to use a declared variable for deconstructing assignments, you must be very careful.

/ / wrong way of writing

Let x

{x} = {x: 1}; / / will report an error

Because the JavaScript engine understands {x} as a block of code, a syntax error occurs. This problem can only be solved by not writing curly braces at the beginning of the line and preventing JavaScript from interpreting it as a code block.

/ / write it correctly

Let x

({x} = {x: 1})

Placing it in parentheses prevents JavaScript from interpreting it as a code block.

At this point, the study of "what is the knowledge related to ES6 in JavaScript" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.