TypeScript（ES6）变量提升（Hoisting）

ES6 新特性

• ES2015(ES6) 新增加了两个重要的 JavaScript 关键字: let 和 const。
• let 声明的变量只在 let 所在的代码块内有效。
• const 声明一个只读的常量，一旦声明，常量的值就不能改变。并且，一旦声明必须初始化，否则会报错

let 和 var 的区别

• var 声明的变量在全局范围内有效。
• let 只能声明同名变量一次，var 可以声明多次
• let 不存在变量提升，var 会变量提升

Hoisting（变量提升）

变量提升（Hoisting）被认为是， Javascript 中执行上下文 （特别是创建和执行阶段）工作方式的一种认识。在 ECMAScript® 2015 Language Specification 之前的 JavaScript 文档中找不到变量提升（Hoisting）这个词。不过，需要注意的是，开始时，这个概念可能比较难理解，甚至烦人。

例如，从概念的字面意义上说，变量提升 意味着变量和函数的声明会在物理层面移动到代码的最前面，但这么说并不准确。实际上变量和函数声明在代码里的位置是不会动的，而是在编译阶段被放入内存中时变动。

技术范例

JavaScript 在执行任何代码段之前，将函数声明放入内存中的优点之一是，你可以在声明一个函数之前使用该函数。例如：

catName("Chloe");

function catName(name) {
    console.log("我的猫名叫 " + name);
}

/*
代码执行的结果是: "我的猫名叫 Chloe"
*/

即使我们在定义这个函数之前调用它，函数仍然可以工作。这是因为在 JavaScript 中执行上下文的工作方式造成的。

变量提升也适用于其他数据类型和变量。变量可以在声明之前进行初始化和使用。但是如果没有初始化，就不能使用它们。

注： 函数和变量相比，会被优先提升。这意味着函数会被提升到更靠前的位置。

只有声明被提升

JavaScript 只会提升变量的声明，不会提升其初始化。如果一个变量先被使用再被声明和赋值的话，使用时的值是 undefined。参见例子：

console.log(num); // Returns undefined
var num;
num = 6;

如果你先赋值、再使用、最后声明该变量，使用时能获取到所赋的值：

num = 6;
console.log(num); // returns 6
var num;

再来看几个类似的例子：

// Example 1 - 变量 y 被提升了，但是它的初始化没有
var x = 1;                 // 声明 + 初始化 x
console.log(x + " " + y);  // 输出：'1 undefined'
var y = 2;                 // 声明 + 初始化 y

// Example 2 - 先赋值后声明也能连名带值被提升
var num1 = 3;                   // Declare and initialize num1
num2 = 4;                       // Initialize num2
console.log(num1 + " " + num2); // 输出：'3 4'
var num2;                       // Declare num2 for hoisting

// Example 3 - 同理
a = 'Cran';              // Initialize a
b = 'berry';             // Initialize b
console.log(a + " " + b); // 输出：'Cranberry'
var a, b;                // Declare both a & b for hoisting

---

参考：

• 菜鸟教程：ES6 let 与 const
• MDN Web Docs：变量提升