JavaScript:Scope(域)的基本指南

nintyuui發表於2021-09-09

Scope決定了程式碼中變數,函式和物件的可見性。在這裡瞭解所有細節。

圖片描述

Scope是JavaScript和程式設計的一個重要方面。Scope限制了整個程式碼中變數,函式和物件的可見性以及可用性。

這帶來了很多好處,其中包括:

  • 安全 - 變數只能在需要的地方訪問。

  • 減少變數名空間衝突 - 當兩個或更多變數共享一個通用名稱時,會發生變數名衝突。變數範圍有助於減少阻止這種情況發生。


在最基本的層面上,JavaScript有兩種型別的範圍:

  • Global Scope(全域性作用域)

  • Local Scope(區域性作用域)


全域性作用域

當你開始用JavaScript編寫程式碼時,你就已經在全域性範圍內。任何在全域性範圍內編寫的東西都可以在JavaScript程式碼中的任何地方訪問

var cat = 'Jerry';
function localScopeExample(){  // LOCAL SCOPE
  console.log(cat); // Jerry}
// GLOBAL SCOPEconsole.log(cat); // Jerry

區域性作用域

區域性作用域稍微複雜一點。區域性作用域變數只能在區域性作用域(它們被定義的地方)中可見和可訪問。您可以將區域性作用域視為您在全域性範圍內建立的任何新範圍。

一個簡單的例子就是在使用函式時。用JavaScript編寫的每個函式都會建立一個新的區域性作用域。這些區域性作用域的變數只能在它們定義的函式中訪問。

我們來看一個例子。我們將建立一個函式並在該函式中宣告變數cat。貓可以訪問並且可以在該功能的任何地方使用。但是,在函式之外呼叫cat將導致Uncaught ReferenceError:

function localScopeExample(){  // LOCAL SCOPE
  var cat = 'Jerry';  console.log(cat); // Jerry}
// GLOBAL SCOPEconsole.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在全域性範圍內,func2func1範圍內宣告。由於詞彙範圍的限制,您可以在範圍2中訪問全域性作用域範圍1中的所有內容:

// GLOBAL SCOPEvar dog = 'Lewis';
function func1(){  // SCOPE 1
  var cat = 'Jerry';
  var func2 = function(){    // SCOPE 2
    console.log(cat); // Jerry
    console.log(dog); // Lewis
  }
}

塊級作用域

使用var時,變數既可以是全域性作用域,也可以區域性作用於定義它的函式。塊級作用域如ifforwhile{}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

關鍵要點:

  • 全域性範圍的持續時間與系統一樣長。

  • 區域性變數在函式啟動時建立,並在函式結束時刪除。

  • 詞法作用域允許內部函式訪問其外部函式的作用域

  • constlet是塊範圍變數。塊範圍不適用於var


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/3209/viewspace-2801085/,如需轉載,請註明出處,否則將追究法律責任。

相關文章