Article directory
In JavaScript, let and var are both keywords for declaring variables, but there are some differences in usage and scope.
let is a new keyword for declaring variables introduced in ES6. Compared with var, it is more strict, has more standardized syntax, and can avoid some common errors.
1 statement promotion
-
There is no variable promotion in let
Variables declared using the var keyword are promoted to the top of the current scope, while variables declared using let are not. So, variables declared using var can be used before declaration, but variables declared using let must be used after declaration.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ES6新特性：let关键字</title>
</head>
<body>
<script>
console.log('myVar:', myVar); //myVar: undefined
var myVar = '我是var声明的变量';
console.log('myVar:', myVar); //myVar: 我是var声明的变量
console.log('myLet:', myLet); //报错，Cannot access 'myLet' before initialization
let myLet = '我是let声明的变量';
console.log('myLet:', myLet); //myLet: 我是let声明的变量
</script>
</body>
</html>
2 Scope
-
Variables declared with let have block-level scope
Variables declared using var have function scope or global scope, while variables declared using let have block scope.
Block-level scope means that variables are only visible inside the block in which they are defined. This means that a variable declared using let can only be used within the block-level scope in which it is declared, without affecting the outer scope.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ES6新特性：let关键字</title>
</head>
<body>
<script>
{
var myVar = '我是var声明的变量';
let myLet = '我是let声明的变量';
}
console.log('myVar:', myVar); //myVar: 我是var声明的变量
console.log('myLet:', myLet); //报错：myLet is not defined
</script>
</body>
</html>
3 Repeat statement
-
let does not allow repeated declaration of variables
Variables declared using var can be declared repeatedly, but variables declared using let cannot be declared repeatedly.
Repeated declaration means declaring a variable again with the same variable name in the same scope. If you use var to declare a variable with the same name, the previous declaration will be overwritten. If let is used to declare a variable with the same name, the following error will be thrown.
Identifier 'myLet' has already been declared
In short, when declaring variables in the future, just use let!