js中的let和var有什么区别与联系

145 阅读2分钟

在JavaScript中,letvar 都是用来声明变量的关键字。它们的主要区别在于作用域变量提升的行为。

作用域

在块级作用域内,使用let声明的变量只在当前作用域内有效,而在全局作用域中,letvar声明的变量具有相同的作用域。

function foo() {
  if (true) {
    var x = 1;
    let y = 2;
  }
  console.log(x); // 1
  console.log(y); // Uncaught ReferenceError: y is not defined
}

foo();

在这个例子中,使用var声明的变量x可以在块级作用域外访问,而使用let声明的变量y只在当前块级作用域内有效。

变量提升

使用 var 声明的变量会被提升到作用域顶部,而使用 let 声明的变量则不会。

function foo() {
  console.log(x); // undefined
  console.log(y); // Uncaught ReferenceError: Cannot access 'y' before initialization
  var x = 1;
  let y = 2;
}

foo();

在这个例子中,使用 var 声明的变量 x 被提升到函数作用域的顶部,因此在变量声明之前使用它不会报错,但是它的值为 undefined。而使用 let 声明的变量 y 在声明之前访问会抛出 ReferenceError 异常。

重复声明

在同一个作用域中,使用 let 重复声明一个已经存在的变量会抛出 SyntaxError 异常,而使用 var 则不会报错。

jsCopy code
function foo() {
  let x = 1;
  let x = 2; // Uncaught SyntaxError: Identifier 'x' has already been declared
  var y = 3;
  var y = 4;
  console.log(y); // 4
}

foo();

在这个例子中,使用 let 重复声明变量 x 会抛出异常,而使用 var 重复声明变量 y 不会报错,后面的声明会覆盖前面的声明

小结

总的来说,let var 都是用来声明变量的关键字,它们的主要区别在于作用域和变量提升的行为。建议使用 let 来声明变量,因为它能够更好地控制作用域,避免变量提升和重复声明的问题。