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