ECMAScript6学习笔记——块级作用域

ES5没有块级作用域的弊端：

ES5 只有全局作用域和函数作用域，没有块级作用域，这带来很多不合理的场景。例如：

var s = 'hello';

for (var i = 0; i < s.length; i++) {
console.log(s[i]);
}

console.log(i); // 5

上面代码中，变量

i

只用来控制循环，但是循环结束后，它并没有消失，泄露成了全局变量。

let

实际上为 JavaScript 新增了块级作用域。

块级作用域的出现，实际上使得获得广泛应用的立即执行函数表达式（IIFE）不再必要了。

// IIFE 写法
(function () {
var tmp = ...;
...
}());

// 块级作用域写法
{
let tmp = ...;
...
}

块级作用域与函数声明

ES5 规定，函数只能在顶层作用域和函数作用域之中声明，不能在块级作用域声明。

ES6 引入了块级作用域，明确允许在块级作用域之中声明函数。ES6 规定，块级作用域之中，函数声明语句的行为类似于

let

，在块级作用域之外不可引用。

在浏览器的 ES6 环境中，块级作用域内声明的函数，行为类似于

var

声明的变量。其他环境的实现不用遵守，还是将块级作用域的函数声明当作

let

处理。

// 浏览器的 ES6 环境
function f() { console.log('I am outside!'); }

(function () {
if (false) {
// 重复声明一次函数f
function f() { console.log('I am inside!'); }
}

f();
}());
// Uncaught TypeError: f is not a function

因为类似于var声明的变量，所以会var f = undefined;提升到声明函数f的前边（变量提升）。

如果确实需要在块级作用域内声明函数，也应该写成函数表达式，而不是函数声明语句。

// 函数声明语句
{
let a = 'secret';
function f() {
return a;
}
}

// 函数表达式
{
let a = 'secret';
let f = function () {
return a;
};
}

ES6 的块级作用域允许声明函数的规则，只在使用大括号的情况下成立，如果没有使用大括号，就会报错。

do 表达式

使得块级作用域可以变为表达式，也就是说可以返回值

let x = do {
let t = f();
t * t + 1;
};

变量

x

会得到整个块级作用域的返回值。