JavaScript：Scope（域）的基本指南

voidking 發(fā)布于2019-08-02 10:24 / 1188人閱讀

摘要：變量范圍有助于減少阻止這種情況發(fā)生。但是，在函數(shù)之外調(diào)用將導(dǎo)致由于局部變量只能在其函數(shù)中訪問，因此可以在不同的函數(shù)中使用相同的變量名稱詞法作用域?qū)W習(xí)詞法作用域也很重要。局部變量在函數(shù)啟動(dòng)時(shí)創(chuàng)建，并在函數(shù)結(jié)束時(shí)刪除。

Scope決定了代碼中變量，函數(shù)和對象的可見性。在這里了解所有細(xì)節(jié)。

Scope是JavaScript和編程的一個(gè)重要方面。Scope限制了整個(gè)代碼中變量，函數(shù)和對象的可見性以及可用性。

這帶來了很多好處，其中包括：

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

減少變量名空間沖突 - 當(dāng)兩個(gè)或更多變量共享一個(gè)通用名稱時(shí)，會發(fā)生變量名沖突。變量范圍有助于減少阻止這種情況發(fā)生。

在最基本的層面上，JavaScript有兩種類型的范圍:

Global Scope（全局作用域）

Local Scope（局部作用域）

全局作用域

當(dāng)你開始用JavaScript編寫代碼時(shí)，你就已經(jīng)在全局范圍內(nèi)。任何在全局范圍內(nèi)編寫的東西都可以在JavaScript代碼中的任何地方訪問

var cat = "Jerry";

function localScopeExample(){
  // LOCAL SCOPE
  console.log(cat); // Jerry
}

// GLOBAL SCOPE
console.log(cat); // Jerry

局部作用域

局部作用域稍微復(fù)雜一點(diǎn)。局部作用域變量只能在局部作用域（它們被定義的地方）中可見和可訪問。您可以將局部作用域視為您在全局范圍內(nèi)創(chuàng)建的任何新范圍。

一個(gè)簡單的例子就是在使用函數(shù)時(shí)。用JavaScript編寫的每個(gè)函數(shù)都會創(chuàng)建一個(gè)新的局部作用域。這些局部作用域的變量只能在它們定義的函數(shù)中訪問。

我們來看一個(gè)例子。我們將創(chuàng)建一個(gè)函數(shù)并在該函數(shù)中聲明變量cat。貓可以訪問并且可以在該功能的任何地方使用。但是，在函數(shù)之外調(diào)用cat將導(dǎo)致Uncaught ReferenceError：

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

// GLOBAL SCOPE
console.log(cat); // Uncaught ReferenceError: cat is not defined

由于局部變量只能在其函數(shù)中訪問，因此可以在_不同的函數(shù)中使用相同的變量名稱_：

function func1(){
  var cat = "Jerry";
  console.log(cat); // Jerry
}

function func2(){
  var cat = "Tom";
  console.log(cat); // Tom
}

詞法作用域

學(xué)習(xí)詞法作用域也很重要。詞法作用域（也稱為靜態(tài)作用域）是內(nèi)部函數(shù)訪問外部函數(shù)范圍的能力。

我們來看一個(gè)例子。在下面的代碼中，我們定義了兩個(gè)函數(shù) - func1在全局范圍內(nèi)，func2在func1范圍內(nèi)聲明。由于詞匯范圍的限制，您可以在_范圍2_中訪問_全局作用域_和_范圍1_中的所有內(nèi)容：

// GLOBAL SCOPE
var dog = "Lewis";

function func1(){
  // SCOPE 1
  var cat = "Jerry";

  var func2 = function(){
    // SCOPE 2
    console.log(cat); // Jerry
    console.log(dog); // Lewis
  }
}

塊級作用域

使用var時(shí)，變量既可以是全局作用域，也可以局部作用于定義它的函數(shù)。塊級作用域如if，for，while，{}對var 沒有影響。

let & const,另一方面，它們被限定在它們所定義的區(qū)塊內(nèi)。我們來看一個(gè)例子：

let x = 1;

{
  let x = 2;
  console.log(x); // 2
}

console.log(x); // 1

正如你在上面看到的那樣，簡單地使用括號來創(chuàng)建一個(gè)代碼塊將在本地范圍內(nèi)在該塊內(nèi)聲明的任何變量。相同的概念適用于其他塊范圍：

let x = 1;

if (x !== 2) {
  let x = 2;
  console.log(x); // 2
}

console.log(x); // 1

但要小心。如果您不小心重新聲明具有相同塊范圍的相同變量，則會出現(xiàn)錯(cuò)誤：

{
  let x = 1;
  let x = 2;
}

Uncaught SyntaxError: Identifier "x" has already been declared

關(guān)鍵要點(diǎn)：

全局范圍的持續(xù)時(shí)間與系統(tǒng)一樣長。

局部變量在函數(shù)啟動(dòng)時(shí)創(chuàng)建，并在函數(shù)結(jié)束時(shí)刪除。

詞法作用域允許內(nèi)部函數(shù)訪問其外部函數(shù)的作用域

const和let是塊范圍變量。塊范圍不適用于var。

GPU云服務(wù)器云服務(wù)器 scope作用域 javascript的基本組成 javascript指南 javascript教程指南

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/52334.html

發(fā)表評論

登陸后可評論

0條評論

voidking

男|高級講師

我要關(guān)注我要私信

TA的文章

云虛擬主機(jī)有什么用-云虛擬主機(jī)有什么優(yōu)勢嗎？

閱讀 1061·2021-09-22 15:26
易探云：金秋上云季活動(dòng),香港/美國/日本云服務(wù)器僅18元/首月;香港/國內(nèi)物理機(jī)低至390元/月起

閱讀 2637·2021-09-09 11:52
狗盾云：亞太雙向CN2+美國GIA CN2節(jié)點(diǎn)CDN，免費(fèi)1個(gè)月，號稱打不死

閱讀 1924·2021-09-02 09:52
DediPath：全場5折優(yōu)惠，E3-1230v3/16G/240G SSD/30T/1Gbps/5

閱讀 2258·2021-08-12 13:28
前端實(shí)例練習(xí) - 模態(tài)圖

閱讀 1197·2019-08-30 15:53
鳥瞰前端 , 再論性能優(yōu)化

閱讀 524·2019-08-29 13:47
IE9無法支持大尺寸CSS的陷阱

閱讀 3399·2019-08-29 11:00
切圖崽的自我修養(yǎng)－SeaJs重要概念剖析

閱讀 3108·2019-08-29 10:58

成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

上云采購季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺、長期優(yōu)惠，快來選購！

JavaScript：Scope（域）的基本指南

相關(guān)文章