在JavaScript中,let、var和const的区别

来源:IT星空
访问量:93
发布日期:2023-12-08

先说下共同点:

他们都是JavaScript的关键字,都是用来声明变量。

区别:

1、作用域不同:var如果是在函数内声明,他的作用域是该函数内部,如果在函数外声明,那他就是全局变量。而let和const声明的变量属于块级作用域,他们的范围只在当前包裹他们的代码块内有效。例如:

function hello() {
   var x = 1; // 函数作用域
   if (true) {
       let y = 2; // 块级作用域
       const z = 3; // 块级作用域
       console.log(x, y, z); // 输出: 1 2 3
   }
   console.log(x, y, z); // ReferenceError: y is not defined
}
hello();

在这个例子中,`var`声明的变量`x`在整个函数内都是可见的,而`let`和`const`声明的变量`y`和`z`只在它们所在的块(这里是`if`语句)内可见。

2、var存在变量提升现象,即变量可以在声明之前调用,值为undefined。而let和const不存在此类现象,即它们所声明的变量一定要在声明后使用,否则报ReferenceError错误。

console.log(a); // 输出: undefined
var a = 1;
console.log(b); // ReferenceError: b is not defined
let b = 2;
console.log(c); // ReferenceError: c is not defined
const c = 3;

在这个例子中,`var`声明的变量`a`在声明之前就可以使用,但是值为`undefined`。而`let`和`const`声明的变量`b`和`c`在声明之前使用会报错。

3、var可以重复声明,即重复声明不会报错;但let变量不能重新声明,否者报错;const变量不仅不明重复声明,而且声明后不能修改,类似声明常量。

var d = 1;
var d = 2; // 重复声明d不会报错
console.log(d); // 输出: 2
let e = 1;
let e = 2; // 报语法错误:SyntaxError: Identifier 'e' has already been declared
const f = 1;
f = 2; // 报类型错误:TypeError: Assignment to constant variable.

在这个例子中,`var`声明的变量`d`可以被重复声明,而`let`声明的变量`e`不能在同一个作用域内被重复声明。`const`声明的变量`f`不能被修改。