TypeScript 的变量声明

开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第9天，点击查看活动详情

前言

let 和 const 是 JavaScript 里相对较新的变量声明方式。 像我们之前提到过的， let 在很多方面与 var 是相似的，但是可以帮助大家避免在 JavaScript 里常见一些问题。

var和let都用于声明变量，不同的是：

let 声明的变量不能重复声明。

var 声明

一直以来我们都是通过var关键字定义JavaScript变量。

var a = 10;

大家都能理解，这里定义了一个名为a值为10的变量。

我们也可以在函数内部定义变量：

function f() {
    var message = "Hello, world!";
    return message;
}

并且我们也可以在其它函数内部访问相同的变量。

function f() {
  var a = 10;
  return function g() {
      var b = a + 1;
      return b;
  }
}
var g = f();
g(); // returns 11;

上面的例子里，g可以获取到f函数里定义的a变量。 每当 g被调用时，它都可以访问到f里的a变量。 即使当 g在f已经执行完后才被调用，它仍然可以访问及修改a。

function f() {
    var a = 1;

    a = 2;
    var b = g();
    a = 3;

    return b;

    function g() {
        return a;
    }
}

f(); // returns 2

let 声明

现在你已经知道了var存在一些问题，这恰好说明了为什么用let语句来声明变量。 除了名字不同外， let与var的写法一致。

let hello = "Hello!";

主要的区别不在语法上，而是语义，我们接下来会深入研究。

块作用域

当用let声明一个变量，它使用的是词法作用域或块作用域。 不同于使用 var声明的变量那样可以在包含它们的函数外访问，块作用域变量在包含它们的块或for循环之外是不能访问的。

function f(input: boolean) {
    let a = 100;

    if (input) {
        // Still okay to reference 'a'
        let b = a + 1;
        return b;
    }

    // Error: 'b' doesn't exist here
    return b;
}

这里我们定义了2个变量a和b。 a的作用域是f函数体内，而b的作用域是if语句块里。

总结

var是函数作用域，let 是块状作用域： 在函数里使用 var 声明了一个变量，那么这个变量在整个函数内都是有效的，例如在上述代码中 for 循环里用var声明一个变量，在 for 循环外也是可以使用的。但是let作用域是块状作用域，只在作用域里有效，例如在 for 循环里用let声明一个变量，在 for 循环外面是不能被访问的。

使用 let 声明的变量不属于顶层对象 顶层对象,在浏览器中指的是 window,在 node 环境中指的是 global 对象。 var 声明的变量属于顶层对象 window，因此可以通过 window. 变量名 来访问这些变量，而 let 和 const 声明的变量不能这样访问。