What is the difference between var, let and const in JavaScript?

Difference: 1. Variables declared by var belong to function scope, while variables declared by let and const belong to block-level scope; 2. Variable promotion exists in var, but not in let and const; 3. Var variables can Repeated declaration, but in the same block-level scope, let variables cannot be redeclared, and const variables cannot be modified.

Recommended tutorial: "JavaScript Video Tutorial"

Declaring variables in JavaScript before the emergence of ES6 (ES2015) Only through the var keyword, function declaration is through the function keyword. After ES6, the declaration methods include var, let, const, function, class. This article mainly discusses the differences between var, let and const.

Understanding var

If you declare a variable using the keyword var, then the variable belongs to the current function scope. If the declaration occurs at the top level outside any function declaration, then this variable belongs to the global scope. For example:

var a = 1; //此处声明的变量a为全局变量
function foo(){
   var a = 2;//此处声明的变量a为函数foo的局部变量
   console.log(a);//2
}
foo();
console.log(a);//1

If you omit var when declaring a variable, the variable will become a global variable. If the variable exists in the global scope, its value will be updated. For example:

var a = 1; //此处声明的变量a为全局变量
function foo(){
   a = 2;//此处的变量a也是全局变量
   console.log(a);//2
}
foo();
console.log(a);//2

Note: Variables declared with var are subject to hoisting.

Understanding "Promotion"

Promotion means that no matter where var appears in a scope, this statement belongs to the entire current scope, everywhere in it Can be accessed. Note that only variable declarations will be promoted, not assignments to variables. As shown in the following example:

console.log(a);//undefined
var a = 1;

This code segment has the same logic as the following code segment:

var a;
console.log(a);//undefined
a = 1;

And if an undeclared variable is operated, an error will be reported

console.log(b);//假设b未声明过，Uncaught ReferenceError: b is not defined

Understand let

The variables declared by let have the following characteristics:

• The variables declared by let have the characteristics of block scope.

• In the same block-level scope, variables cannot be declared repeatedly.

• There is no variable promotion for variables declared by let. In other words, there is a temporary dead zone (TDZ) in the let declaration.

As shown in the following examples

let a = 1;
console.log(a);//1
console.log(b);//Uncaught ReferenceError: b is not defined
let b = 2;

function foo(){
    let a = 1;
    let a = 2;//Uncaught SyntaxError: Identifier 'a' has already been declared
}

The following is a classic example of var and let:

for (var i = 0; i < 10; i++) {
    setTimeout(function(){
        console.log(i);
    },100)
};

After the code is run , 10 10s will be printed on the console. If modified to:

for (let i = 0; i < 10; i++) {
    setTimeout(function(){
        console.log(i);
    },100)
};

, after the code is run, 0-9 will be printed on the console.

Understand const

The const declaration method, in addition to the above characteristics of let, also has a characteristic, that is, variables defined by const cannot be modified once defined, that is, what is declared by const is a constant.

For example:

const a = 1;
console.log(a);//1
a = 2;
console.log(a);//Uncaught TypeError: Assignment to constant variable.

However, it does not mean that the internal content of a variable declared by const is immutable, such as:

const obj = {a:1,b:2};
console.log(obj.a);//1
obj.a = 3;
console.log(obj.a);//3

So to be precise, a const declaration creates a value A read-only reference. But that doesn't mean the value it holds is immutable, just that the variable identifier cannot be reassigned.

Summary of differences

• Variables declared by var belong to the function scope, while variables declared by let and const belong to the block-level scope;

• var has variable promotion phenomenon, but let and const do not have such phenomenon;

• var variable can be declared repeatedly, but in the same block-level scope , let variables cannot be redeclared, and const variables cannot be modified.

For more programming-related knowledge, please visit: Programming Teaching! !

The above is the detailed content of What is the difference between var, let and const in JavaScript?. For more information, please follow other related articles on the PHP Chinese website!