javascript
JavaScript:Scope(域)的基本指南
Scope決定了代碼中變量,函數和對象的可見性。在這里了解所有細節。
Scope是JavaScript和編程的一個重要方面。Scope限制了整個代碼中變量,函數和對象的可見性以及可用性。
這帶來了很多好處,其中包括:
- 安全 - 變量只能在需要的地方訪問。
- 減少變量名空間沖突 - 當兩個或更多變量共享一個通用名稱時,會發生變量名沖突。變量范圍有助于減少阻止這種情況發生。
- *
在最基本的層面上,JavaScript有兩種類型的范圍:
- Global Scope(全局作用域)
- Local Scope(局部作用域)
全局作用域
當你開始用JavaScript編寫代碼時,你就已經在全局范圍內。任何在全局范圍內編寫的東西都可以在JavaScript代碼中的任何地方訪問
var cat = 'Jerry'; function localScopeExample(){// LOCAL SCOPEconsole.log(cat); // Jerry } // GLOBAL SCOPE console.log(cat); // Jerry局部作用域
局部作用域稍微復雜一點。局部作用域變量只能在局部作用域(它們被定義的地方)中可見和可訪問。您可以將局部作用域視為您在全局范圍內創建的任何新范圍。
一個簡單的例子就是在使用函數時。用JavaScript編寫的每個函數都會創建一個新的局部作用域。這些局部作用域的變量只能在它們定義的函數中訪問。
我們來看一個例子。我們將創建一個函數并在該函數中聲明變量cat。貓可以訪問并且可以在該功能的任何地方使用。但是,在函數之外調用cat將導致Uncaught ReferenceError:
function localScopeExample(){// LOCAL SCOPEvar cat = 'Jerry';console.log(cat); // Jerry } // GLOBAL SCOPE console.log(cat); // Uncaught ReferenceError: cat is not defined由于局部變量只能在其函數中訪問,因此可以在_不同的函數中使用相同的變量名稱_:
function func1(){var cat = 'Jerry';console.log(cat); // Jerry } function func2(){var cat = 'Tom';console.log(cat); // Tom }詞法作用域
學習詞法作用域也很重要。詞法作用域(也稱為靜態作用域)是內部函數訪問外部函數范圍的能力。
我們來看一個例子。在下面的代碼中,我們定義了兩個函數 - func1在全局范圍內,func2在func1范圍內聲明。由于詞匯范圍的限制,您可以在_范圍2_中訪問_全局作用域_和_范圍1_中的所有內容:
// GLOBAL SCOPE var dog = 'Lewis'; function func1(){// SCOPE 1var cat = 'Jerry'; var func2 = function(){// SCOPE 2console.log(cat); // Jerryconsole.log(dog); // Lewis} }塊級作用域
使用var時,變量既可以是全局作用域,也可以局部作用于定義它的函數。塊級作用域如if,for,while,{}對var 沒有影響。
let & const,另一方面,它們被限定在它們所定義的區塊內。我們來看一個例子:
let x = 1; {let x = 2;console.log(x); // 2 } console.log(x); // 1正如你在上面看到的那樣,簡單地使用括號來創建一個代碼塊將在本地范圍內在該塊內聲明的任何變量。相同的概念適用于其他塊范圍:
let x = 1; if (x !== 2) {let x = 2;console.log(x); // 2 } console.log(x); // 1但要小心。如果您不小心重新聲明具有相同塊范圍的相同變量,則會出現錯誤:
{let x = 1;let x = 2; } Uncaught SyntaxError: Identifier 'x' has already been declared關鍵要點:
- 全局范圍的持續時間與系統一樣長。
- 局部變量在函數啟動時創建,并在函數結束時刪除。
- 詞法作用域允許內部函數訪問其外部函數的作用域
- const和let是塊范圍變量。塊范圍不適用于var。
總結
以上是生活随笔為你收集整理的JavaScript:Scope(域)的基本指南的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: PHP大文件分片上传
- 下一篇: javascript 实现快排 ,三向切