Block Bindings

Block Bindings

一般来讲，变量的声明方式在 Javascript 的变成中是一个棘手的部分(tricky part)。在大部分 C-Based 语言中，变量是在声明的地方创建的。但是在 Javascript 中并不是如此。 你的变量创建的地方依赖于你是怎样声明这些变量的，在 ECMAScript 6 中提供了选择让你能够更容易的控制这些变量的作用范围。这一章节将讲述为什么传统的 var 声明方式会出现令人困惑的原因，介绍在 ECMAScript 6 中引进的块级绑定，并介绍使用他们的最佳实践方法。

var 声明与提升

使用 var 声明的变量会提升到函数的顶部（就是说在函数体的一开始的地方，或者对于全局作用域来说就是提升到文件一开头的地方)，而不管这些变量实际是在哪里声明的。为了阐明这个提升做了什么，请看下面的函数定义：

function getValue(condition) {

    if (condition) {
        var value = "blue";

        // other code

        return value;
    } else {

        // value exists here with a value of undefined

        return null;
    }

    // value exists here with a value of undefined
}

如果你不熟悉 Javascript ，那么你可能会认为变量 value 只会在 condition 条件为 true 的时候才会创建。但是，变量 value 无论如何都会被创建。 实际上 Javascript 引擎会对 getValue 这个函数做一些修改，使得该函数看起来像如下的函数：

function getValue(condition) {

    var value;

    if (condition) {
        value = "blue";

        // other code

        return value;
    } else {

        return null;
    }
}

value 变量的声明被移到了函数的顶部，且初始化本身保留在原来的地方。 这就意味着变量 value 实际上在 else 子句里面依旧是可以访问的。 如果在 else 里面访问，那么只会得到一个 undefined 的值因为它并没有初始化。

一个新手 Javascript 开发者通常需要一段时间来熟悉声明的提升，并误解这种唯一的行为最终导致出现 BUGS。 基于这个原因， EMCAScript 6 引进了块级作用域选项( block level scoping options )来对变量的声明周期进行进一步的控制。

块级声明

块级声明指的是那些在指定的块中声明的变量无法在块之外访问的声明方式。块级作用域创建于：

1. 在一个函数中
2. 在一个块中(由 {} 指定的范围)

块级作用域是大多数 C-Based 语音工作的方式，在 ECMAScript 6 中引进块级声明是为了给 Javascript 带来灵活性和一致性。

let 声明

let 声明语法跟 var 语法一样。 你可以在使用 var 的使用地方用 let 来取代，使得该变量的作用域限定在当前的代码块中。 因为 let 并不会将变量提升到围绕的块的顶部，所以你或许要将 let 声明放到代码块的开始的地方，这样变量才能在代码块中的所有地方使用。例子：

function getValue(condition) {

    if (condition) {
        let value = "blue";

        // other code

        return value;
    } else {

        // value doesn't exist here

        return null;
    }

    // value doesn't exist here
}

这个版本的 getValue 函数会表现得更加像你希望在 C-Based 语言中的行为一样。 value 变量使用 let 来声明而不是 var。 这就表示声明不会被提升到函数体的顶部，并且这个变量在代码块执行结束时会被销毁。如果条件为 false，吗，那么 value 就不会被声明和初始化。

不能重复声明

如果一个标识符在当前的作用域范围已经声明，那么使用 let 再来声明一次就是抛出错误。例如：

var count = 30;

// Syntax error
let count = 40;

在这个例子中， count 被声明了2次，第一次使用 var, 第二次使用 let。因为 let 不会重新定义一个已经在同一个作用域范围内变量，所以这个声明会抛出错误。 如果一个 let 声明创建了一个新的变量，这个变量跟包围的范围重名，这样是合法的。只是不能同一个作用域。例如：

var count = 30;

// Does not throw an error
if (condition) {

    let count = 40;

    // more code
}

这个 let 声明不会抛出错误因为它新建了一个新的变量而不是在围绕其的块中。 在 if 块中，这个新的变量会隐藏全局的 count 变量，防止对全局的 count 变量的访问直到执行离开这个块。

常量声明

在 ECMAScript 6 中另一个定义变量的方法是使用 const 声明语法。 使用 const 声明的变量就是常量，意味着这些变量的值一旦设置了就不能改变。 所以每个变量都需要在声明的时候初始化。例如：

// Valid constant
const maxItems = 30;

// Syntax error: missing initialization
const name;

maxItems 变量初始化了，所以正常工作。但是 name 没有，当你尝试运行这段代码时就会抛出一个错误，因为它没被初始化。 所有的常量声明必须伴随初始化否则就会报语法错误。

const 与 let 的异同

常量跟 let 声明一样，是块级声明。 这表示常量在离开声明的代码块会被销毁，并且不会被提升到块的顶部。例如：

if (condition) {
    const maxItems = 5;

    // more code
}

// maxItems isn't accessible here

在这个代码中， 常量 maxItems 在 if 语句中声明。 一旦这个语句结束执行， maxItems 也会被销毁。

跟 let 一样， const 也不能重新定义一个已经在同一作用域范围声明过的标识符。不管这个标识符是使用 var 还是使用 let 来声明的。例如：

var message = "Hello!";
let age = 25;

// Each of these would throw an error given the previous declarations
const message = "Goodbye!";
const age = 30;

上面两个const声明如果是独立的话都是合法的，但是给定了前面使用 var 和 let 声明后就是错误的。

尽管有这些共同点， let 与 const 之间仍有一个很大的区别：尝试一个使用了 const 定义的变量再赋值会抛出一个错误，无论在不在 strict 模式下。

const maxItems = 5;

maxItems = 6;      // throws error