ES6 variable definition

ES6 variable definition

1. Introduction to ES6

ECMA is a standard, JavaScript is the implementation
of ECMAScript ES6 is a version of ECMAScript, released in 2015, also called ES2015

2.let keyword

ES6 new keywords are used to declare variables. The usage is similar to var, but the declared variable is only valid in the code block where the let is located.

var a = [];
    for (var i = 0; i < 10; i++) {
    
    
       a[i] = function(){
    
    
           console.log(i);
       }
}
a[6](); //用var声明变量遇到for循序的大括号是不会形成作用与的，返回值是 10，这里i是全局变量

 var a = [];
    for (let i = 0; i < 10; i++) {
    
    
        a[i] = function () {
    
    
            console.log(i);
        }
    }
    a[6](); //6  i是let声明的，当前的i只在本轮循环中有效，每一个循环中的i其实都是一个新的变量，所以输出的是6

 for (let i = 0; i < 3; i++) {
    
    
       let i = "abc";
       console.log(i);
       //结果：输出3次abc。
		//原因：在代码块中的变量i与for循环中的变量i不在用一个作用域。
    }

2.1 There is no variable promotion

Var has variable promotion, that is, the variable is used before the declaration, and the value is undefined. js will place the declaration statement before all js code to execute

//上图代码就相当于下面的代码变现，声明玩直接使用，还么有赋值，所以为undefined。
var a;
console.log(a);
a=10;

When the above figure is output, an error is reported directly, so there is no variable promotion for let

2.2 Temporary dead zone

var tmp = 123;
    if(true){
    
    
        tmp = "abc";
        let tmp;
        console.log(tmp);
    }
    //结果：提示错误`Cannot access 'tmp' before initialization`

When using variables, it will first look for variables in the same scope. The above code, tmp=abcwill give priority to looking below let tmpand let tmpvariable lift does not exist, an error .

Summary: In the code block, letbefore using a command to declare a variable, the variable is in an unavailable state. Syntactically, it is called a "temporary dead zone"

2.3 Duplicate declarations are not allowed

let a = "hello";
let a = "word";
console.log(a)
//输出会直接提示错误 ， 

function show(a) {
    
    
        let a = 10;
    }
    show(100);
//以上代码中，函数的形参`a`与函数内部的`a`作用域相等，所以会报错。

3. Block-level scope

3.1 Why block-level scope is needed

ES5 has only global scope and local scope (function scope), not block-level scope.

• Disadvantage 1: Internal variables may cover outer variables

In the above case, the iforiginal intention of the code block outside is to use the outer layer, dateand the inside to use the internal date. But after the function is executed, the result is undefinedbecause there is a promotion of variables. Causes internal datecoverage of external datevariables

• Disadvantage 2: The count variable in the for loop is leaked as a global variable.
  
  In the above case, for·the variable in the loop is ionly used as a count, but after the for loop is executed, it does not disappear, but still exists as a global variable. It may not be used again in the future, resulting in a waste of resources.

3.2 ES6 block-level scope

function show() {
    
    
        let a = "yasuo";
        if (true) {
    
    
            let a = "jianhao"; 
            {
    
    
                let a = "孤儿索"
            }
            console.log(a);//输出为jianhao
        }
        console.log(a);//输出为yasuo
    }
    show();
    //块级作用域下的变量不会对外层的变量造成影响，同时支持多层嵌套。

const

1. Basic usage

constIt is also used to declare variables, but it declares a read-only constant. Once declared, the value cannot be modified.

const PI = 3.1425926;
        alert(PI)
//---------------------------------------
// 如果值被修改了，就会报错
const PI = 3.1425926;
        PI = 3.14;
        alert(PI)

1.2 Must be initialized

const PI;
PI = 3.1415926;
alert(PI);
//Missing initializer in const declaration  const声明中缺少初始化式

Because the value of the variable declared by const cannot be modified, once the variable is declared by const, it must be initialized.

1.3 General variable names are capital letters

This is a norm

1.4 It also has block scope

constSame as ``let`, it will only take effect in the scope of the code block where the declaration is located .

1.5 There is no promotion of variables

alert(PI);
const PI = 3.1415926;
//报错

1.6 Non-repeatable declaration

var PI = "3.14";
 const PI = 3.1415926;

1.7 Modifying elements in arrays and objects does not count as changes to constants

constThe memory address of the value pointed to by the variable saved by the variable. For simple data (numerical value, string, boolean), the value is stored in the memory address pointed to by the variable.

For compound data types, the memory address pointed to by the variable is only the address of the object, and changes in the content will not change the memory address of the object.

const obj = {
    
    
	name:"亚索"
}
obj.name = "疾风剑豪";
console.log(obj.name);
//疾风剑豪