ECMA学JS：let、const、var变量声明特性剖析——提升声明与暂时性死区详述

前端

2023-10-28 03:43:29

变量声明基础

var：随性定义，全局自由

var作为传统变量声明方式，允许开发人员在任何位置声明变量，包括全局和局部作用域。同时，var声明的变量可以重复声明，导致变量值覆盖和变量污染等问题。

let：局部管控，变量安全

let作为现代变量声明方式，强调块级作用域，即在声明时就确立变量的作用域，使其仅在声明所在块级范围内有效。let声明的变量不可重复声明，有助于避免变量污染和提升代码的可读性。

const：常量守护，数据固定

const作为常量声明方式，与let具有相似作用域规则，但不可修改，在声明时必须初始化值，且初始化后值不可改变。const声明常量有助于提升代码的健壮性和安全性。

变量提升：先行声明，稍后分配

变量提升是JavaScript中独有的机制，即在代码执行前，将变量声明提升至当前执行上下文的顶部，并初始化为undefined。这种机制允许开发人员在使用变量前声明变量，确保变量在使用前已经存在。

暂时性死区：定义前不能访问

暂时性死区(TDZ)是let和const变量在声明前的一段特殊区域，在此区域内，变量尚未创建，访问该变量将导致ReferenceError错误。暂时性死区的存在有助于防止在变量声明前使用变量，确保代码的安全性。

变量作用域：管辖范围，各司其职

作用域是变量可被访问的范围，不同声明方式具有不同的作用域规则。var具有全局作用域或函数作用域，而let和const具有块级作用域。作用域概念有助于管理变量的可见性和避免变量冲突。

示例详解：理解变量声明特性

// var声明
var x = 10; // 全局作用域
function foo() {
    var x = 20; // 函数作用域
    console.log(x); // 输出: 20
}
foo();
console.log(x); // 输出: 10

// let声明
let y = 30; // 块级作用域
if (true) {
    let y = 40; // 块级作用域
    console.log(y); // 输出: 40
}
console.log(y); // 输出: 30

// const声明
const z = 50; // 块级作用域
z = 60; // 报错: TypeError: Assignment to constant variable.