您好,登錄后才能下訂單哦!
本篇內容介紹了“JavaScript作用域分為幾類”的有關知識,在實際案例的操作過程中,不少人都會遇到這樣的困境,接下來就讓小編帶領大家學習一下如何處理這些情況吧!希望大家仔細閱讀,能夠學有所成!
JavaScript作用域分為全局作用域和局部作用域兩類。變量在函數外定義為全局變量,全局變量有全局作用域,即網頁中的所有腳本和函數均可使用;變量在函數內部聲明為局部作用域,局部作用域一般只在固定的代碼片段(例函數)內部可訪問到。
本教程操作環境:windows7系統、javascript1.8.5版、Dell G3電腦。
變量的作用域(scope),指的是變量在腳本代碼中的可讀、寫的有效范圍,也就是腳本代碼中可以使用這個變量的區域。
變量的作用域主要分為全局作用域、局部作用域(也稱函數作用域)兩種。
相應作用域的變量分別稱為全局變量、局部變量。全局變量聲明在所有函數之外;局部變量是在函數體內聲明的變量或者是函數的命名參數。
全局作用域(Global Scope)
變量在函數外定義為全局變量,全局變量有全局作用域:網頁中的所有腳本和函數均可使用。
在代碼中任何地方都能訪問到的對象擁有全局作用域,一般來說以下幾種情形擁有全局作用域:
1、最外層函數和在最外層函數外面定義的變量擁有全局作用域
2、所有末定義直接賦值的變量自動聲明為擁有全局作用域
3、所有window對象的屬性擁有全局作用域
一般情況下,window對象的內置屬性都擁有全局作用域,例如window.name、window.location、window.top等等。
局部作用域(Local Scope)
變量在函數內部聲明為局部作用域。
和全局作用域相反,局部作用域一般只在固定的代碼片段(例:函數)內部可訪問到,最常見的例如函數內部,所有在一些地方也會看到有人把這種作用域稱為函數作用域。
總之呢,當JS解析器執行時,首先就會在執行環境里構建一個全局對象,我們定義的全局屬性就是做為該對象的屬性讀取,在頂層代碼中我們使用this關鍵字和window對象都可以訪問到它。
而函數體中的局部變量只在函數執行時生成的調用對象中存在,函數執行完畢時局部變量即刻銷毀。
因此在程序設計中我們需要考慮如何合理聲明變量,這樣既減小了不必要的內存開銷,同時能很大程度地避免變量重復定義而覆蓋先前定義的變量所造成的Debug麻煩。
說明:
變量的作用域跟聲明方式有很密切的關系。使用 var 聲明的變量的作用域有全局作用域和函數作用域;使用 let 和 const 聲明的變量有全局作用域、局部作用域。
注意:嚴格意義的全局變量都屬于 window 對象的屬性,但 let 和 const 聲明的變量并不屬于 window 對象,所以它們并不是嚴格意義上的全局變量,在此僅僅從它們的作用域這個角度來說它們是全局變量的。
由于 var 支持變量提升,所以 var 變量的全局作用域是對整個頁面的腳本代碼有效;而 let 和 const 不支持變量提升,所以 let 和 const 變量的全局作用域指的是從聲明語句開始到整個頁面的腳本代碼結束之間的整個區域,而聲明語句之前的區域是沒有效的。
同樣,因為 var 支持變量提升,而 let 和 const 不支持變量提升,所以使用 var 聲明的局部變量在整個函數中有效,而使用 let 和 const 聲明的局部變量從聲明語句開始到函數結束之間的區域有效。需要注意的是,如果局部變量和全局變量同名,則在函數作用域中,局部變量會履蓋全局變量,即在函數體中起作用的是局部變量;在函數體外,全局變量起作用,局部變量無效,此時引用局部變量將出現語法錯誤。
示例:變量的作用域
var v1 = "JavaScript"; //全局變量 let v2 = "JScript"; //全局變量 let v3 = "Script"; //全局變量 scopeTest(); //調用函數 function scopeTest(){ var lv = "aaa"; //局部變量 var v1 = "bbb"; //局部變量 let v2 = "ccc"; //局部變量 console.log("函數體內輸出的lv = " + lv); //aaa console.log("函數體內輸出的v1 = " + v1); //bbb console.log("函數體內輸出的v2 = " + v2); //ccc console.log("函數體內輸出的v3 = " + v3); //Script //v4為全局變量,賦值在后面,因而值為undefined console.log("函數體內輸出的v4 = " + v4); } var v4 = "VBScript"; //全局變量 console.log("函數體外輸出的lv = " + lv); //① 報ReferenceError錯誤 console.log("函數體外輸出的v1 = " + v1); //JavaScript console.log("函數體外輸出的v2 = " + v2); //JScript console.log("函數體外輸出的v3 = " + v3); //Script console.log("函數體外輸出的v3 = " + v4); //VBScript
上述腳本代碼分別聲明了 4 個全局變量、3 個局部變量。在 scopeTest 函數體外,變量 v1、v2、v3 和 v4 為全局變量;在 scopeTest 函數體內,lv、v2是全局變量。
我們看到,局部變量 v1 和 v2 與全局變量 v1 和 v2 同名,在 scopeTest 函數體內,局部變量 v1 和 v2 有效,因而在函數體這 2 個變量的輸出結果分別為“bbb”和“ccc”;在函數體外,全局變量 v1 和 v2 有效,因而在函數體外,這 2 個變量的輸出結果分別為“JavaScript”和“JScript”。
另外,全局變量 v3 和 v4 在函數體中沒有被覆蓋,因而輸出的是全局變量的值,所以 v3 在函數體內和體外的輸出結果都為“Script”,而 v4 變量的賦值在函數調用的后面,因而在函數體中的 v4 輸出結果為“undefined”,而在函數體外的輸出是在聲明之后,所以結果為“VBScript”。lv 是局部變量,因而在函數體外訪問會報“ReferenceError”錯誤。
上述代碼在 Chrome 瀏覽器中運行后,打開瀏覽器的控制臺,可以看到下圖所示的輸出結果
上圖 所示報第 18 行代碼(即示例 ① 處注釋的代碼)中的 lv 沒有定義的引用錯誤,這是因為 lv 變量為局部變量,離開函數后無效。將這行代碼注釋后再運行,此時打開瀏覽器控制臺可看到下圖所示結果
“JavaScript作用域分為幾類”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業相關的知識可以關注億速云網站,小編將為大家輸出更多高質量的實用文章!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。