问题

变量声明的方式与它们的区别？

---

在 JavaScript 中，有多种变量声明方式，主要包括使用 var、let、const 关键字，下面详细介绍它们及其区别。

1. var

• 特点
  • 函数作用域：var 声明的变量具有函数作用域，意味着在函数内部任何位置声明的 var 变量，在整个函数内部都是可见的。
  • 变量提升：使用 var 声明的变量会被提升到当前作用域的顶部，可以在声明之前访问，但值为 undefined。
  • 可重复声明：在同一作用域内可以多次使用 var 声明同一个变量。
• 示例代码

function testVar() {
  console.log(num); // 输出: undefined
  var num = 10;
  console.log(num); // 输出: 10
  var num = 20; // 可以重复声明
  console.log(num); // 输出: 20
}
testVar();

2. let

• 特点
  • 块级作用域：let 声明的变量具有块级作用域，变量只在声明它的块（如 if 语句、for 循环、while 循环等）内部可见。
  • 不存在变量提升：let 声明的变量不会被提升到当前作用域的顶部，在声明之前访问会导致 ReferenceError。
  • 不可重复声明：在同一作用域内不能使用 let 重复声明同一个变量。
• 示例代码

function testLet() {
  // console.log(count); // 报错: ReferenceError: Cannot access 'count' before initialization
  let count = 10;
  console.log(count); // 输出: 10
  // let count = 20; // 报错: SyntaxError: Identifier 'count' has already been declared
  if (true) {
    let innerCount = 20;
    console.log(innerCount); // 输出: 20
  }
  // console.log(innerCount); // 报错: ReferenceError: innerCount is not defined
}
testLet();

3. const

• 特点
  • 块级作用域：和 let 一样，const 声明的常量具有块级作用域。
  • 不存在变量提升：const 声明的常量不会被提升到当前作用域的顶部，在声明之前访问会导致 ReferenceError。
  • 必须初始化：使用 const 声明常量时，必须同时进行初始化，否则会报错。
  • 常量值不可变（基本类型）：一旦声明并初始化，基本类型的常量的值就不能再被重新赋值，但如果常量是引用类型（如对象、数组），可以修改其内部属性。
  • 不可重复声明：在同一作用域内不能使用 const 重复声明同一个常量。
• 示例代码

function testConst() {
  // const PI; // 报错: SyntaxError: Missing initializer in const declaration
  const PI = 3.14;
  // PI = 3.14159; // 报错: TypeError: Assignment to constant variable.
  console.log(PI); // 输出: 3.14

  const person = { name: "Alice" };
  person.name = "Bob"; // 可以修改对象的属性
  console.log(person.name); // 输出: Bob
}
testConst();

总结

声明方式	作用域	提升情况	可重复声明	初始化要求	值可变性
var	函数作用域	变量提升	是	否	是
let	块级作用域	无提升	否	否	是
const	块级作用域	无提升	否	是	基本类型不可变，引用类型可修改内部属性

在实际开发中，建议优先使用 const 声明常量，当需要重新赋值时使用 let，尽量避免使用 var 以减少潜在的问题。

问题补充

for (var i = 0; i < 5; ++i) {
  setTimeout(() => console.log(i), 0);
}
for (let i = 0; i < 5; ++i) {
  setTimeout(() => console.log(i), 0);
}

上面两个块分别会输出什么?

第一块（var）：

5
5
5
5
5

第二块（let）：

0
1
2
3
4

• var 声明的变量具有函数作用域，且在循环中共享同一个闭包变量 i。当 setTimeout 回调执行时，循环早已结束，i 的值为 5。
• let 声明的变量具有块级作用域，每次循环迭代都会创建一个新的词法环境，每个 setTimeout 回调捕获的是各自迭代中的 i 值。