TypeScript uses let and const to declare variables

Use let to declare variables

Keywords let is ES6 new features added, it appears to solve var some of the problems that exist in the variable declaration, let grammar and declaring variables var like, for example:

let a = 1;

In fact let and var is not in syntax, but in semantics.

Block-level scope (also called lexical scope) was introduced in let What does block scope mean? We know that using braces {} surround code can be called a code block, for example, for example, if , for and other statements are {} right, the code block is the code block. If we use the let keyword to declare a variable in the braces, then the scope of the variable is only in the braces and cannot be used outside the braces. This is the block-level scope.

So this point is also let and var . If the variable is also declared if statement in a certain function, the var is in the entire function, while the scope of the variable declared by let if statement. .

Example:

We can look at the following myFunc of code. In the function 0612a4f7c14b1a, a variable a is declared let , and a variable b if statement:

function myFunc(){
    let a = 10;
    if(a > 5) {
        let b = a;
        return b;
    }
    return b;
}

According to the block-level scope we talked about above, we can know that the scope of the a myFunc() , and the scope of the b if statement block, and the variable a can be used in the function, but if we if statement 0612a4f7c14b8 b is used in other places, an error will occur.

The following picture shows the error message prompted by the VSCode editor:

Now we should understand what a block-level scope is. If it is still not clear, then try it yourself.

Variable promotion

When we use the keyword var declare the variable, the variable promotion will be carried out, and the use of the keyword let to declare the variable can help us solve this problem.

What does variable promotion mean, that is, variables can be declared after use, that is, variables can be used first and then declared. But be aware that variable promotion will only promote the declaration, not the initialization of the variable.

Example:

For example, in the following code, we first use the variable a , and then declare it:

console.log(a);
var a = 1;  // 声明并赋值

After running the code, it will output undefined (the default value of the variable is undefined), which means that the keyword var will perform variable promotion, but from the output result is not 1, it can be seen that this only promotes the declaration of the variable, and does not promote the initialization of the variable.

And if we change the keyword var to let , the same code:

console.log(a);
let a = 1;

Executing the code at this time will output ReferenceError: Cannot access 'a' before initialization . This shows let will not be promoted.

Declare a variable multiple times

When using var declare a variable, we can declare a variable multiple times at the same time, but only the last one takes effect.

However, let does not support this. Use let declare variables. A variable can only be declared once at the same time, otherwise an error will be reported.

Example:

For example, using var to declare the a 3 times, after executing the code, only the last time will take effect, so the output result of the code is 3:

var a = 1;
var a = 2;
var a = 3;
console.log(a);  

// 输出：3

If you use let repeatedly declare a variable, an error will be reported, and the error message tells us that the variable has been declared:

let a = 1;
let a = 2;
let a = 3;
console.log(a);  

// Identifier 'a' has already been declared

const declaration variable

const and let are the same when declaring variables, as shown below:

const num = 9;

const is also a block-level scope. The only difference let const that the variable declared by 0612a4f7c14f5c can only be assigned at the time of declaration and cannot be assigned again afterwards. That is to say const cannot be changed after being assigned.

Using const declare a variable does not mean that the value of the declared variable cannot be changed, but the memory address pointed to by the variable cannot be changed. Using const declare data types such as numeric values, strings, Boolean values, etc., can be understood as constants, because the values of these initial types are stored in the memory address pointed to by the variable.

Example:

For example, use const declare different types of variables:

const num = 9;            // 数字类型
const username = 'xkd';  // 字符串类型
const my = true;         // 布尔类型

If we modify the values of these variables (constants), an error will be reported:

But for composite data such as arrays and objects, the memory address pointed to by the variable is just a pointer. const can make the pointer unchanged, but the attribute values of array elements and objects can be modified.

Example:

Declare an object, and then modify the properties in the object:

From the above figure, we can see that, although the data of the composite type cannot be directly reassigned to the declared variable, the property value of the object can be modified object. property.

In our actual use, it is best to use let and const to declare variables to reduce the use of var All variables except those that need to be modified should be declared const