作用域分類
1.全局作用域
2.函數(shù)作用域
3.塊級作用域(ES6新增)
什么是全局作用域妇押?
1.最外層的變量、函數(shù)
2.未定義直接賦值的變量(不建議這么做紊册!嚴(yán)格模式會報錯8缮荨)
沒啥好說的~
什么是函數(shù)作用域?
1.函數(shù)內(nèi)部代碼塊糯彬,能夠嵌套
注意點(diǎn):JavaScript中的函數(shù)運(yùn)行在它們被定義的作用域里凭语,而不是它們被執(zhí)行的作用域里
下面是代碼親測:
演示代碼
輸出結(jié)果:
① 'global'
解析:echo函數(shù)在全局作用域定義(name=‘global'),調(diào)用處在env函數(shù)作用域內(nèi)(name='env')撩扒,結(jié)果為'global'似扔,可以看出,函數(shù)運(yùn)行時的作用域為定義時的作用域搓谆。
②③ 'env'
解析:兩處調(diào)用的是同一個函數(shù)(都是innerEnv炒辉,定義處name=‘env’),但是它們調(diào)用處的作用域不一樣泉手,②處name='env'黔寇,③處name='global',而調(diào)用結(jié)果都為'env'斩萌,再次說明缝裤,函數(shù)運(yùn)行時的作用域為定義時的作用域。
什么是塊級作用域颊郎?
1.let倘是、const定義的變量
// 代碼展示
{
var a = 'var';
let b = 'let';
const c = 'const';
}
console.log(a);
// console.log(b); // 報錯,b is not defined
// console.log(c); // 報錯袭艺,c is not defined
塊級作用域小技巧
for (var i = 0; i < 5; i++) {
setTimeout(function () {
console.log(i);
}, 100);
}
上面這段代碼本意是輸出:0 1 2 3 4,結(jié)果輸出:5 5 5 5 5叨粘,批量綁定DOM事件時很常見(當(dāng)然猾编,用事件委托可能更好)
沒有塊級作用域之前,使用自執(zhí)行函數(shù)解決:
for (var i = 0; i < 5; i++) {
(function (i) {
setTimeout(function () {
console.log(i);
}, 100);
})(i);
}
有了塊級作用域之后升敲,是這樣的:
for (let i = 0; i < 5; i++) {
setTimeout(function () {
console.log(i);
}, 100);
}
非常簡潔~