一篇文章帶你了解JavaScript作用域
回復“前端”即可獲贈前端相關學習資料
在JavaScript中,對象和函數(shù)也是變量。在JavaScript中,作用域是你可以訪問的變量、對象和函數(shù)的集合。
JavaScript 有函數(shù)作用域: 這個作用域在函數(shù)內(nèi)變化。
一、本地JavaScript變量
一個變量聲明在JavaScript函數(shù)內(nèi)部,成為函數(shù)的局部變量。
局部變量有局部作用域: 它們只能在函數(shù)中訪問。
JS:
//code here can not use carName<script>reFunction();document.getElementById("demo").innerHTML ="carName的類型是 " + typeof carName;function reFunction() {var carName = "Volvo";}</script>

由于局部變量只在它們的函數(shù)中被識別,所以具有相同名稱的變量可以在不同的函數(shù)中使用。
當函數(shù)啟動時創(chuàng)建局部變量,當函數(shù)完成時刪除。
二、全局JavaScript變量
函數(shù)外聲明的變量, 成為全局變量。
全局變量具有全局作用域: 網(wǎng)頁上的所有腳本和函數(shù)都可以訪問它。
<script>var carName = "Volvo"; //可以從任何腳本或函數(shù)訪問全局變量myFunction();function myFunction() {document.getElementById("demo").innerHTML ="I can display " + carName;}</script>

自動全局
如果給未聲明的變量賦值, 它會自動成為全局變量。
此代碼示例將聲明一個全局變量carName,即使賦的值是函數(shù)內(nèi)部。
myFunction();// code here can use carNamefunction myFunction() {carName = "Volvo";}

不要創(chuàng)建全局變量,除非你非常需要,在嚴格模式下 "Strict Mode"自動全局變量將失敗。
三、在HTML中的全局變量
在JavaScript中,全局作用域是完整的JavaScript環(huán)境。
在HTML中,全局作用域是window對象。所有的全局變量都屬于window對象。
<html lang="en"><head><meta charset="UTF-8"><title>項目</title></head><body style="background-color: aqua;"><p>在HTML中,所有的全局變量將成為窗口window變量。</p><p id="demo"></p><script>var carName = "Volvo";// code here can use window.carNamedocument.getElementById("demo").innerHTML = "I can display " + window.carName;</script></body></html>

全局變量(或函數(shù))可以覆蓋窗口變量(或函數(shù)). 任何函數(shù),包括窗口對象,都可以覆蓋全局變量和函數(shù).
四、JavaScript 代碼塊作用域
表中是var,let和const之間的區(qū)別。
| 關鍵詞 | 范圍 | 可以重新分配 | 可以重新聲明 |
|---|---|---|---|
| var | 函數(shù)作用域 | 是 | 是 |
| let | 塊作用域 | 是 | 否 |
| const | 塊作用域 | 否 | 否 |
用var關鍵字聲明的變量不能具有塊作用域,{}可以從塊外部訪問在塊內(nèi)部聲明的變量:
{var num = 50;}// num 能在這里使用
用let關鍵字聲明的變量可以具有“塊作用域”。
{}不能從塊外部訪問在塊內(nèi)部聲明的變量:
{let num = 50;}// num不能在這里使用
聲明變量with const與let]涉及塊作用域類似。
{const num = 50;}// num不能在這里使用
常量的值不能通過重新分配而更改,也不能重新聲明。
五、總結(jié)
本文基于JavaScript,介紹了了函數(shù)作用域和變量作用域。介紹了變量中全局變量的幾種顯示的方法,在HTML中的全局變量應該如何去表示。通過案例的講解,讓讀者更好的去理解。
代碼很簡單, 希望能夠幫助你學習。
------------------- End -------------------
往期精彩文章推薦:

歡迎大家點贊,留言,轉(zhuǎn)發(fā),轉(zhuǎn)載,感謝大家的相伴與支持
想加入前端學習群請在后臺回復【入群】
萬水千山總是情,點個【在看】行不行
