Var is function scope, let,const is block scope.

Example 1:

{
    let a = 10;
    var b = 1;
}
    console.log(a)
    console.log(b)
Copy the code

B =1; let =1; var =1; These two variables are then called outside of the code block, with the let variable reporting an error and the var variable returning the correct value. This indicates that the variable declared by the LET is valid only in the code block in which it is located.

Example 2:

for(let i=0; i<arr.length; I ++){} console.log(I) // report that the counter I of the above code was not found, only valid in the for loop body. For (var I =0; i<arr.length; I ++){} console.log(I) // result 4Copy the code

Note: It is best to use let inside the for loop

Stay state supplement code:

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](); / / 6Copy the code

Let, const has no variable promotion

function do_something() {
	console.log(foo); // ReferenceError
	let foo = 2;
}
function do_something() {
	console.log(foo); // 2
	var foo = 2;
}
Copy the code

Cause: Temporary dead zone As long as the let command exists in the block-level scope, the variables declared by it are “binding” to the region, no longer subject to external influence. ES6 explicitly states that if there are let and const commands in a block, the variables declared by the block to those commands form a closed scope from the start. If you use these commands before the declaration, an error will be reported. In short, the variable is not available within the code block until it is declared using the let command. This is grammatically known as a “temporal dead zone” (TDZ).

Let const cannot be defined repeatedly

Example 1:

function () { let a = 10; var a = 1; Function () {let a = 10; let a = 1; }Copy the code

Reason: Let does not allow multiple declarations of the same variable in the same scope.

Example 2:

	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
        }
Copy the code

Difference: The above function has two code blocks. Let declares the variable n and prints 5 when run. 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.

A caveat to const:

Note: Const is also used to declare variables, but only constants. Once declared, the value of a constant cannot be changed. The following code shows that changing the value of a constant does not work. It is important to note that reassigning a constant does not report an error, but silently fails.

Const PI = 3.1415; PI = 3; PI // 3.1415 const PI = 3.1; PI / / 3.1415Copy the code

Note: Since the const command only points to the address of the variable, you must be careful when declaring an object as a constant

const foo = {}; foo.prop = 123; Foo.prop // 123 foo = {} // does not workCopy the code

In the code above, the constant foo stores an address that points to an object. Only the address is immutable, that is, you can’t point foo to another address, but the object itself is mutable, so you can still add new attributes to it. Here’s another example.

const a = []; a.push("Hello"); // execute a.length = 0; A = ["Dave"]; / / an errorCopy the code

In the above code, the constant A is an array. The array itself is writable, but an error is reported if another array is assigned to A. If you really want to freeze an Object, you should use the object. freeze method.

const foo = Object.freeze({}); foo.prop = 123; // It doesn't workCopy the code

In the code above, the constant foo refers to a frozen object, so adding new attributes doesn’t work