Distinguish the different characteristics of var, let and const

Understanding the different characteristics of var, let and const requires specific code examples

In JavaScript, there are many ways to declare variables, the most common of which include using var, let and const keywords. Although they are both used to declare variables, they have different characteristics regarding scope and mutability. The differences between them are explained below with specific code examples.

var keyword

Let’s first look at the usage of the var keyword. It is the earliest introduced way to declare variables and has the characteristics of global scope and function scope. For example, we can declare a variable like this:

var name = "Alice";

function sayHello() {
  var message = "Hello " + name;
  console.log(message);
}

sayHello(); //输出：Hello Alice
console.log(message); //报错：message未定义

In the above example, the name variable is declared in the global scope and is referenced in the sayHello function. The message variable is declared inside the sayHello function and is only valid within the scope of the function. Using the message variable outside a function results in an undefined error.

In addition, variables declared by var can be reassigned. For example:

var x = 10;
console.log(x); //输出：10

x = 20;
console.log(x); //输出：20

let keyword

The let keyword is a new feature introduced in ES6. Compared with the var keyword, it has the feature of block-level scope. Block-level scope means that variables are valid within the block in which they are declared, including if statements, for loops, functions, etc. Here is an example of using let to declare a variable:

let name = "Bob";

if (true) {
  let name = "Alice";
  console.log(name); //输出：Alice
}

console.log(name); //输出：Bob

In the above example, the name variable is redeclared within the if statement block and is only valid within that block. When the name variable is referenced outside a block, the value outside the block is used.

Unlike var, variables declared by let cannot be redeclared, but they can be reassigned. For example:

let x = 10;
console.log(x); //输出：10

x = 20;
console.log(x); //输出：20

const keyword

The const keyword is also a new feature introduced in ES6 and is used to declare constants. Similar to let, const also has the characteristics of block-level scope. The difference is that variables declared using const must be initialized when declared and cannot be modified once assigned. The following is an example of using const to declare a constant:

const PI = 3.14;
console.log(PI); //输出：3.14

PI = 3.14159; //报错：无法修改常量

In the above example, PI is declared as a constant and is initialized at the time of declaration. In subsequent code, the constant PI cannot be modified.

It should be noted that the constant declared by const is the immutability of the variable reference, not the immutability of the variable value. That is, if the variable is of object or array type, the value of its properties or elements can be modified, but the value cannot be reassigned to the variable.

const person = { name: "Alice" };
person.name = "Bob";

console.log(person); //输出：{ name: "Bob" }

person = { name: "Alice" }; //报错：无法修改常量

Through the above code examples, we can better understand the different characteristics between var, let and const. var has function scope and can be reassigned, let has block-level scope and can be reassigned, and const has block-level scope and cannot be reassigned. Choosing the appropriate declaration depends on the needs and design of your code.

The above is the detailed content of Distinguish the different characteristics of var, let and const. For more information, please follow other related articles on the PHP Chinese website!