在看《JavaScript高级编程》时看到块级作用域时，将ES5和ES6中的函数作用域和块级作用域的作用范围搞混淆了，以为块级作用域包含函数作用域，之后就陷入纠结，为了弄懂这个问题查看了很多资料，终于搞明白，要赶紧记录下来.
及时总结
首先我们先来了解下两个概念
函数作用域：创建函数后在花括号中声明的一些语句或变量只在当前函数中起作用。
块级作用域：ES6带来的新特性，在语句块中声明的语句或变量只在当前语句块中起作用.
接下来我们分别从ES5和ES6了解函数作用域和块级作用域。
ES5中
函数作用域：和上文提到的一样，作用域仅限于函数内部。
function add(a, b) {
var sum= a + b;
return sum;
}
console.log(add(1,3));
console.log(sum); // ReferenceError: sum is not defined
可以看出若在函数之外访问sum就会报错，说变量sum没有声明。
块级作用域：在上文中我们提到 “块级作用域” 是ES6带来的新特性，那么在ES5中时没有这个功能滴.
if(true) {
var name='douqing';
console.log(name); // douqing
}
console.log(name); // douqing
从上面代码可以看出不论是在if语句内部访问name还是在外部访问name都不会报错.
ES6
函数作用域 : 和ES5相比语法并没有变化.
function add(a, b) {
let sum = a + b;
return sum;
}
console.log(add(1, 3)); // 4
console.log(sum); // ReferenceError: sum is not defined
从外部访问函数内部变量还是会报错.
块级作用域 : 不允许从外部访问块级作用域内部变量.
if(true) {
let name='douqing';
console.log(name); // douqing
}
console.log(name); // ReferenceError: name is not defined
从if语句块外部访问name,会报错说明name没有声明.
看到这大家会发现,函数作用域和块级作用域根本没有直接关系,函数作用域在ES5和ES6作用完全一样,你的变量不论是使用var声明还是使用了let ,const声明在外部都是不可以访问的.
而块级作用域指的就是使用 if () { }; while ( ) { } ...这些语句所形成的语句块 , 并且其中变量必须使用let或const声明(否则就不是块级作用域了),保证了外部不可以访问语句块中的变量.
网友评论