简述TypeScript 中的 var 和 let 有什么区别？

TypeScript面试题 0 112

在TypeScript（以及ES6及更高版本的JavaScript）中，var和let都用于变量声明，但它们之间存在几个重要区别：

1. 作用域

var：var声明的变量具有函数作用域，这意味着在函数内部声明的变量在整个函数内都是可见的，包括在声明之前。如果在函数外部声明，var声明的变量则具有全局作用域。
let：let声明的变量具有块级作用域，即只在包含它的代码块（例如循环、条件语句等）内部可见。

2. 提升

变量提升：使用var声明的变量会被提升到其作用域的顶部，这意味着变量可以在声明之前被访问，此时变量的值为undefined。
暂时性死区：使用let声明的变量也会提升，但不允许在声明之前访问它们，这种情况被称为“暂时性死区”（Temporal Dead Zone，TDZ）。尝试在声明前访问let变量会导致引用错误。

3. 重复声明

var：在同一作用域内，var允许重复声明同一个变量，后面的声明会覆盖前面的声明。
let：在同一作用域内，let不允许重复声明同一个变量，尝试这样做会导致语法错误。

示例

// var 的作用域和提升
function varTest() {
    console.log(x); // undefined，因为var变量提升
    var x = 1;
    if (true) {
        var x = 2;  // 同一作用域，覆盖前面的x
        console.log(x); // 2
    }
    console.log(x); // 2，因为var是函数作用域
}

// let 的作用域和暂时性死区
function letTest() {
    // console.log(y); // 错误，y不能在声明前使用
    let y = 1;
    if (true) {
        let y = 2;  // 不同的作用域
        console.log(y); // 2
    }
    console.log(y); // 1，因为let是块级作用域
}

结论

鉴于var的一些不直观行为（如变量提升和函数作用域），在TypeScript和现代JavaScript开发中推荐使用let（对于可变变量）和const（对于不可变变量），以提高代码的清晰度和可预测性。

发表评论取消回复

后才能评论