JavaScript 中 let 和 var 的区别

JavaScript 中 let 和 var 的区别

在 JavaScript 中,letvar 都是用来声明变量的关键字,但它们在作用域、提升(hoisting)和重新赋值方面存在显著差异。理解这些差异对于编写高效和无bug的JavaScript代码至关重要。

作用域

var

var 关键字声明的变量拥有函数作用域。这意味着,当 var 用于函数内部时,它只能在这个函数内部被访问。如果在函数外部使用 var,那么它将成为全局变量。

function example() {
    
    
  var localVar = 1;
}
console.log(localVar); // ReferenceError: localVar is not defined

let

let 关键字声明的变量拥有块作用域。块作用域是任何代码块(如 {} 内部)内的区域,例如循环和条件语句。这意味着 let 声明的变量只在它所在的代码块内有效。

if (true) {
    
    
  let blockScopeVar = 1;
}
console.log(blockScopeVar); // ReferenceError: blockScopeVar is not defined

提升(Hoisting)

var

var 声明的变量会被提升到其所在作用域的顶部,但只提升声明,不提升初始化。这意味着变量可以在声明之前被引用,但其值将是 undefined

console.loggetVar); // undefined
var getVar = 1;

let

let 声明的变量也会被提升,但与 var 不同,在初始化之前访问 let 变量会导致引用错误。这被称为“暂时性死区”(temporal dead zone)。

console.log(letVar); // ReferenceError: Cannot access 'letVar' before initialization
let letVar = 1;

重新赋值

var

使用 var 关键字声明的变量可以被重新赋值。

var reassignVar = 1;
reassignVar = 2;

let

使用 let 关键字声明的变量也可以被重新赋值。

let reassignLet = 1;
reassignLet = 2;

总结

  • let 用于块作用域,而 var 用于函数作用域。
  • var 声明的变量会被提升,但 let 声明的变量在初始化之前不能被访问。
  • 两者都可以重新赋值。
    在现代 JavaScript 开发中,推荐使用 let(和 const,用于声明不变的变量)而不是 var,因为 letconst 提供了更清晰的作用域管理和减少了错误的可能性。