在看《JavaScript高級編程》時看到塊級作用域時，將ES5和ES6中的函數(shù)作用域和塊級作用域的作用范圍搞混淆了，以為塊級作用域包含函數(shù)作用域，之后就陷入糾結(jié)，為了弄懂這個問題查看了很多資料，終于搞明白，要趕緊記錄下來.
首先我們先來了解下兩個概念
函數(shù)作用域：創(chuàng)建函數(shù)后在花括號中聲明的一些語句或變量只在當(dāng)前函數(shù)中起作用。
塊級作用域：ES6帶來的新特性，在語句塊中聲明的語句或變量只在當(dāng)前語句塊中起作用.
接下來我們分別從ES5和ES6了解函數(shù)作用域和塊級作用域。
ES5中
函數(shù)作用域：和上文提到的一樣，作用域僅限于函數(shù)內(nèi)部。
function add(a, b) {
var sum= a + b;
return sum;
}
console.log(add(1,3));
console.log(sum); // ReferenceError: sum is not defined
可以看出若在函數(shù)之外訪問sum就會報錯，說變量sum沒有聲明。
塊級作用域：在上文中我們提到 “塊級作用域” 是ES6帶來的新特性，那么在ES5中時沒有這個功能滴.
if(true) {
var name='douqing';
console.log(name); // douqing
}
console.log(name); // douqing
從上面代碼可以看出不論是在if語句內(nèi)部訪問name還是在外部訪問name都不會報錯.
ES6
函數(shù)作用域 : 和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
從外部訪問函數(shù)內(nèi)部變量還是會報錯.
塊級作用域 : 不允許從外部訪問塊級作用域內(nèi)部變量.
if(true) {
let name='douqing';
console.log(name); // douqing
}
console.log(name); // ReferenceError: name is not defined
從if語句塊外部訪問name,會報錯說明name沒有聲明.
看到這大家會發(fā)現(xiàn),函數(shù)作用域和塊級作用域根本沒有直接關(guān)系,函數(shù)作用域在ES5和ES6作用完全一樣,你的變量不論是使用var聲明還是使用了let ,const聲明在外部都是不可以訪問的.
而塊級作用域指的就是使用 if () { }; while ( ) { } ...這些語句所形成的語句塊 , 并且其中變量必須使用let或const聲明(否則就不是塊級作用域了),保證了外部不可以訪問語句塊中的變量.
