ES6 Series declaration variables let and const

This article is mainly to share with you about the ES6 series of statement variables let and const, interested friends can refer to the content of this article

Brief introduction

Concept

The first version of ES6, released in June 2015, is the official name of the ECMAScript 2015 Standard (ES2015). ES6 is both a historical noun and a generic term, meaning the next-generation standard for JavaScript after version 5.1, covering the ES2015, ES2016, ES2017, and so on, while ES2015 is the official name, especially the official version of the language standard published in the year.
Major browsers support for ES6: Kangax

Babel

Babel is a widely used ES6 transcoding device that converts ES6 code into ES5 code, which can be executed in an existing environment.
The Babel configuration file is. BABELRC, which is stored in the root directory of the project. The first step in using Babel is to configure this file.

declaring variables

ES5 has only two methods for declaring variables: the var command and the function command, ES6 addition to the Let, const, import, and class commands. So there are 6 ways to declare variables in ES6.

ES5, the property of the top-level object is equivalent to the global variable. ES6 in order to change this, on the one hand, in order to maintain compatibility, the var command and Function command declaration of global variables, is still the top-level object properties, on the other hand, the Let command, the const command, Class command declared global variables, not belonging to the top-level object properties. That is, starting with ES6, the global variable will gradually decouple from the properties of the top-level object.

Let

ES6 has a new let command to declare variables. Its usage is similar to Var, but the declared variable is valid only within the code block where the Let command resides.

{Let  a = ten;  var b = 1;} A//REFERENCEERROR:A is not defined.b//1

Duplicate declarations are not allowed

Let does not allow the same variable to be declared repeatedly within the same scope.

Error function func () {let  a = ten;  var a = 1;} function func (ARG) {let  arg;//Error}function func (ARG) {  {let    arg;//No Error  }}

Block-level scopes

• ES6 allows arbitrary nesting of block-level scopes.

• The inner scope defines the variable with the same name as the outer scope.

• The outer scope cannot read the variables of the inner scope.

{{{{{{}  insane = ' Hello World '   {let insane = ' Hello World '}  }  Console.log (insane);//Error}}};

Block-level scopes and function declarations

• ES5 states that functions can only be declared in the top-level scope and function scope, not at the block-level scope.

• ES6 states that in block-level scopes, function declaration statements behave like let and are not referenced outside the scope of a block.

You should avoid declaring functions within a block-level scope, considering that the behavior caused by the environment is too different. If you do, you should write a function expression instead of a function declaration statement.

There is no variable promotion

The variable declared by the Let command must be used after the declaration, or an error will be made.

The case of Var console.log (foo); Output Undefinedvar foo = 2;//Let case console.log (bar); Error Referenceerrorlet bar = 2;

Temporary Dead Zone

As long as a let command exists within a block-level scope, the variable it declares is "bound" to the area and is no longer affected by the external.

var tmp = 123;if (true) {  TMP = ' abc ';//Referenceerror let  tmp;}

Within a code block, the variable is not available until the variable is declared with the Let command. This is syntactically called a "temporary Dead zone" (Temporal Dead Zone, abbreviated as TDZ).

Const

Const declares a read-only constant. Once declared, the value of the constant cannot be changed.

• Valid only within the block-level scope where the declaration resides.

• The constants declared by the const command are also not promoted, and there are also temporary dead zones that can only be used after the declared location.

Const PI = 3.1415; PI//3.1415PI = 3;//typeerror:assignment to constant variable.

Essence

The const actually guarantees that the value of the variable cannot be changed, but that the memory address that the variable points to cannot be changed. For a simple type of data (numeric, String, Boolean), the value is stored in the memory address that the variable points to, so it is equivalent to a constant. But for composite types of data (mostly objects and arrays), the memory address that the variable points to is just a pointer, and the const only guarantees that the pointer is fixed, and that the data structure it points to is not variable, and it is completely out of control. Therefore, it must be very careful to declare an object as a constant.

const FOO = {};//Adds an attribute to Foo, can succeed Foo.prop = 123;foo.prop//123//foo points to another object, will error foo = {};//TypeError: "foo" is Rea D-only

If you really want to freeze an object, you should use the Object.freeze method.

const FOO = object.freeze ({});//Normal mode, the following line does not work;//Strict mode, the row error foo.prop = 123;