在 ECMAScript 5 之前，JavaScript 中存在着变量提升的问题，这会给开发者带来很多困扰。在 ES5 中，可以使用 var 声明变量，但是在变量声明之前就能够使用这个变量，这可能导致意外的结果和不易理解的代码行为。因此，ES6 给出了一种新的变量声明方式，叫做 let，它可以解决这个问题。
变量提升引发的问题
当我们在 JavaScript 中使用 var 声明变量时，会出现变量提升问题。也就是说，无论你在何处声明变量，在函数内还是在函数外，它都会被视为声明在函数的开头。如下所示：
console.log(name); // undefined var name = 'john';
这段代码中，在执行 console.log 方法之前，变量 name 已经被声明。但是，由于它被放在了 console.log 语句的后面，它的值会是 undefined。
这种情况会在代码中导致很多不可预料的问题。比如，在循环中使用 var 声明变量：
for (var i = 0; i < 3; i++) {
console.log(i);
}
console.log(i); // 3当我们执行这段代码时，i 的值不仅被自增，它也在循环的外面生效。这与我们通常的期望不符合。
这种行为是由 JavaScript 引擎实现的，与具体的 JavaScript 引擎有关。为了消除这种不确定的行为，ES6 引入了 let 关键字，它可以通过块级作用域来声明变量。
使用 ES6 的 let 关键字
ES6 中的 let 声明可以替换掉 var 声明，更加安全可靠，也更加符合普通编程语言的习惯。当我们在一个块级作用域内 (通常在一个函数中) 声明变量时，该变量仅仅存在这个块级作用域中。
看下面的代码：
console.log(age); // ReferenceError: age is not defined let age = 18;
因为在 age 被声明前它就被调用了，所以 JavaScript 引擎就在这里崩溃了。这看起来不如 var 声明语句舒适，但是这很好：它强制我们在变量被调用前声明它，并且赋予了我们块级作用域的时候。这意味着我们可以通过这种方式暂时隐藏一个变量，并且它只在需要的时候被显示出来。
在下面这个例子中，我们可以看出 let 声明变量可以在循环块级作用域之内声明 X：
for (let x = 0; x < 3; x++) {
console.log(x);
}
console.log(x); // ReferenceError: x is not defined在这个例子中，x 被重新声明了，它在循环的作用域内完成，但在外面，x 并未被声明。因此，我们在循环外部访问 x 的时候，JavaScript 引擎就会通知我们它并未被声明。
结论
ES6 中的 let 关键字解决了变量提升问题，并且带来更符合代码习惯的语法。它将变量声明限制在具体的作用域内，减少了意外的变量声明导致的问题。锻炼好习惯，从 ES6 开始使用 let 关键字来声明变量！
示例代码
-- -------------------- ---- ------- -- -- --- ------------ --- ---- - - -- - - -- ---- - --------------- - --------------- -- -- --- ------- ------------- --- ---- - - -- - - -- ---- - --------------- - --------------- -- --------------- - -- --- ------- -- --- --- - --- ----------- -------- ------ - - - --- - ------- --------------- -- --
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6714c35ead1e889fe215af82