One: var is the function scope, let and const are the block scope.
例子1:
{
let a = 10;
var b = 1;
}
Difference:
a will report that
b=1 cannot be found. The
above code is in the code block, and two variables are declared with let and var respectively. Then call these two variables outside the code block, the result is that the variable declared by let reports an error, and the variable declared by var returns the correct value. This means that the variable declared by let is only valid in the code block in which it is located.
例子2：
var arr=[1,3,4,5]
for(let i=0;i<arr.length;i++){}
console.log(i) //报找不到 上面代码的计数器i，只在for循环体内有效。(区块内)
for(var i=0;i<arr.length;i++){}
console.log(i) //结果4```
Note: It is better to use let in the for loop. If var is used, it does not stay in the state.
Supplementary code for staying state:
var a = [];
for (var i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 10
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 6
Two: let, const does not have variable promotion
例子:
function do_something() {
console.log(foo); // ReferenceError
let foo = 2;
}
function do_something() {
console.log(foo); // 2
var foo = 2;
}
Reason: Temporary Dead Zone
As long as there is a let command in the block-level scope, the variables it declares are "bound" to this area, and are no longer affected by external influences.
ES6 clearly stipulates that if there are let and const commands in a block, the variables declared by these commands in this block will form a closed scope from the beginning. If you use these commands before the statement, you will get an error.
In short, in the code block, the variable is not available until the let command is used to declare the variable. This is grammatically called "temporal dead zone" (TDZ for short).
Three: let const cannot be defined repeatedly
例子1：
// 报错
function () {
let a = 10;
var a = 1;
}
// 报错
function () {
let a = 10;
let a = 1;
}
Reason: let is not allowed to declare the same variable repeatedly in the same scope.
例子2：
function f1() {
let n = 5;
if (true) {
let n = 10;
}
console.log(n); // 5
}
function f2() {
var n = 5;
if (true) {
var n = 10;
}
console.log(n); // 10
}
Difference: The above function has two code blocks, let declares the variable n, and outputs 5 after running. This means that the outer code block is not affected by the inner code block. If you use var to define the variable n, the final output value is 10.
Supplementary explanation of const:
Note: const is also used to declare variables, but the declaration is constant. Once declared, the value of the constant cannot be changed. The following code shows that changing the value of the constant has no effect. It should be noted that reassigning constants will not report an error, but will fail silently.
const PI = 3.1415;
PI // 3.1415
PI = 3;
PI // 3.1415
const PI = 3.1;
PI // 3.1415
Note: Since the const command only points to the address where the variable is located, you must be very careful when declaring an object as a constant
const foo = {};
foo.prop = 123;
foo.prop
// 123
foo = {} // 不起作用
In the above code, the constant foo stores an address, which points to an object. The only thing that is immutable is this address, that is, you cannot point foo to another address, but the object itself is mutable, so you can still add new attributes to it.
Here is another example.
const a = [];
a.push("Hello"); // 可执行
a.length = 0; // 可执行
a = ["Dave"]; // 报错
In the above code, the constant a is an array, the array itself is writable, but if another array is assigned to a, an error will be reported.
If you really want to freeze the object, you should use the Object.freeze method.
const foo = Object.freeze({});
foo.prop = 123; // 不起作用
In the above code, the constant foo points to a frozen object, so adding new attributes does not work