示例 02：let、const 与 var 的行为差异

let、const 与 var：点按钮看行为差异

每类差异一组按钮，点完看下面的日志。示例特意让「错误」也留在页面上——读报错是学 JS 的核心技能。

[迷你控制台]

一、const：不能重新赋值 ≠ 值不可变

const PI = 3.14
PI = 3.15            // ✗ TypeError：变量指向不能换

const user = { name: 'Ada' }
user.name = 'Alan'   // ✓ 允许：改的是对象内部的内容
user = { name: 'Bo' } // ✗ 换对象才不行

二、块级作用域：let 只活在花括号里，var 会漏出去

{
  let blockVar = '块内'
  var funcVar  = '我以为也在块内'
}
console.log(blockVar)  // ✗ ReferenceError：出了块就不认识
console.log(funcVar)   // ✓ '我以为也在块内' —— var 无视花括号

三、暂时性死区（TDZ）：let 也不许你先用后声明

console.log(later)
let later = 1     // ✗ ReferenceError：Cannot access 'later' before initialization

console.log(older)
var older = 1     // 不报错，输出 undefined ——「提升」只声明不赋值，比报错更难查

四、var 的另外两个历史包袱：重复声明与循环泄漏

var a = 1; var a = 2        // 静默通过，第一个值被顶掉
let b = 1; let b = 2        // ✗ SyntaxError：整个脚本都不执行

for (var i = 0; i < 3; i++) { /* … */ }
console.log(i)              // 3 —— 循环变量泄漏到外面，容易被后续代码误用

结论速查

	var	let	const
作用域	函数级	块级	块级
先访问后声明	undefined	ReferenceError	ReferenceError
重复声明	允许	语法错误	语法错误
重新赋值	允许	允许	禁止

日常写法：默认 const，需要重新赋值时才 let，var 不要用。绑定了就不换的常量（配置、DOM 引用、函数）用 const 表达「意图」。