作用域是JavaScript中非?;A(chǔ)的概念,很多剛?cè)腴T的同學(xué)卻弄不懂作用域的概念,但不弄明白的話又不能夠?qū)懗龈咝Ш喗榈拇a,今天小千就來給大家介紹一下關(guān)于前端JavaScript作用域的那點(diǎn)事。
web前端培訓(xùn)" />
什么是作用域
JavaScript 中的作用域是指變量的可訪問性或可見性,也就是說,程序的哪些部分可以訪問該變量,或者該變量在何處可見。
為什么作用域很重要
作用域的主要好處是安全性。也就是說,只能從程序的特定區(qū)域訪問變量,使用作用域,我們可以避免程序其他部分對變量的意外修改。
作用域可減少命名沖突。也就是說,我們可以在不同的作用域內(nèi)使用相同的變量名。
作用域類型
JavaScript中有三種類型的作用域:全局作用域、局部作用域或函數(shù)作用域、塊級作用域。
1. 全局作用域
不在函數(shù)或塊(一對花括號)內(nèi)定義的任何變量都在全局作用域內(nèi),可以從程序的任何位置訪問全局作用域內(nèi)的變量。例如:
2. 局部作用域或函數(shù)作用域
利用 var 在函數(shù)體內(nèi)部聲明的變量都在局部作用域(或稱函數(shù)作用域)內(nèi),它們只能從該函數(shù)內(nèi)部訪問,不能在外部代碼中訪問。例如:
3. 塊級作用域
ECMAScript 2015 引入了 let 和 const 來定義變量,與 var 定義變量不同,它們的作用域是在最接近的花括號內(nèi),這意味著,不能從那對花括號之外訪問它們。例如:
我們可以看到 var 定義的變量可以在塊外部使用,而 let 定義的變量不能在塊外部訪問。
4.嵌套作用域
就像 JavaScript 中的函數(shù)一樣,一個(gè)作用域可以嵌套在另一個(gè)作用域內(nèi)。例如:
這個(gè)代碼片段中有 3 個(gè)作用域彼此嵌套。首先,塊級作用域(由 let 定義的變量創(chuàng)建)嵌套在局部作用域或函數(shù)作用域內(nèi),而后者又嵌套在全局作用域內(nèi)。
5.詞法作用域
詞法作用域(也稱為靜態(tài)作用域),從字面上講是指作用域是在詞法分析(通常稱為編譯)時(shí)確定的,而不是在運(yùn)行時(shí)確定的。以題主的問題作為示例:
在這里,不管是從哪兒調(diào)用 test() 函數(shù),console.log(a) 總是會打印 hello world,這與具有 動態(tài)作用域 的語言 console.log(a) 不同,后者會根據(jù)調(diào)用函數(shù)的位置而打印不同的值。
如果上面的代碼是用支持動態(tài)作用域的語言編寫的,console.log(a) 則會打印出來 I belong to func。
使用詞法作用域,我們可以僅通過查看源代碼來確定變量的作用域,而在動態(tài)作用域下,只有在執(zhí)行代碼后才能確定作用域。
6.作用域鏈
當(dāng)在 JavaScript 中使用變量時(shí),JavaScript 引擎將嘗試在當(dāng)前作用域中查找變量的值,如果找不到變量,它將查找外部作用域并將繼續(xù)這樣做,直到找到變量或到達(dá)全局作用域?yàn)橹?。如果在全局作用域中仍然找不到該變量,它將在全局作用域?nèi)隱式聲明該變量(非嚴(yán)格模式下)或返回錯(cuò)誤。
調(diào)用 bar() 函數(shù)時(shí),JavaScript 引擎將查找 bar 變量并在當(dāng)前作用域中找到了它。接下來,在當(dāng)前作用域中查找 foo 變量,但無法找到它,因此繼續(xù)在外部作用域中查找并找到了它(即全局作用域)。
之后,我們?yōu)?num 變量賦值 99,JavaScript 引擎在當(dāng)前作用域中查找 num 變量,找不到,然后在外部作用域(全局作用域)中查找變量,也找不到,由于腳本不在嚴(yán)格模式下,因此創(chuàng)建一個(gè)名為 num 的新全局變量,并為其分配變量值 99。
以上就是關(guān)于JavaScript作用域的介紹和案例了,如果你對web前端開發(fā)感興趣的話,不妨來千鋒web前端培訓(xùn)班了解一下我們的web前端培訓(xùn)課程,現(xiàn)在咨詢更有全套免費(fèi)學(xué)習(xí)資料可以領(lǐng)取,趕緊賴了解一下吧。