JS之作用域淺談

roland_reed 發布于2019-08-22 15:39 / 469人閱讀

摘要：作用域鏈保證對環境中定義的變量和函數的有序訪問。通俗來說，執行環境和作用域就是變量或函數有效執行所在的一個環境。總結要想搞清作用域，首先要搞清預解析，然后判斷作用域范圍，先判斷本層環境有無聲明及賦值，如果有聲明，則判斷調用前是否賦值。

這幾天看了一下JS高級程序設計里的介紹作用域的章節，也參考了網上的資料，現在結合著自己的理解，給大家分享一下我自己對JS作用域的理解。

作用域及執行環境

這里有三個重要的概念：執行環境、作用域、變量對象

（JS高級程序設計解釋）
執行環境 ：定義變量或函數可訪問的其他數據，來決定它們的行為。
變量對象 ：保存執行環境中定義的變量和函數。
作用域鏈 ：保證對環境中定義的變量和函數的有序訪問。

通俗來說，執行環境和作用域就是變量或函數有效執行所在的一個環境。
總結一下這三者的關系：每個執行環境執行時都會產生一個作用域，作用域前端都有一個變量對象來保存環境中的變量和函數。

知道這3個重要概念后，要想搞清作用域，就要先清楚JS程序的預解析過程：
JS程序開始執行時會先解析語法（檢查錯誤等等）、解析內存，然后把function、var解析到變量對象里。
這里注意解析var變量時只是會把變量名稱解析，而等到程序運行到變量賦值時才會向變量賦值。

var a="A";
function test(){
    console.log(a);//undefined
    var a="B";
}
test();

這段代碼的第一個console.log之所以會是undefined，原因是函數內部的a變量在預解析時已經被解析到變量對象里，但沒被賦值。所以函數執行時找到函數里未被賦值的a變量，輸出undefined。

搞清楚預解析后，在判斷作用域范圍：
因為作用域的查找順序是由局部作用域一步步地往上找，直到找到聲明的變量和函數或已經到了全局作用域。所以局部的作用域可以訪問到外部作用域的變量，而外部作用域訪問不到內部作用域的變量。

相關場景

var a="A";
function test(){
    console.log(a);//“A”
    a="B";
}
test();
console.log(a);//"B"

function test(){  
      b();//函數b會被預解析，因此可以調用，執行了輸出1；
      var a=1;
      function b(){
          console.log(1);
          console.log(a);//undefined
          var a=2;
      }
}
test();

以上例子參考網上資料。

總結

要想搞清作用域，首先要搞清預解析，然后判斷作用域范圍，先判斷本層環境有無聲明及賦值，如果有聲明，則判斷調用前是否賦值。如果找不到聲明，則一層層往外部的作用域找，直到全局環境也找不到時，通常就會報錯。

如果有解釋的不對或不清晰的，歡迎留言討論。

GPU云服務器云服務器設計淺談淺談javascript js數據類型作用 js文件沒有作用

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/93638.html

淺談前端存儲

摘要：淺談前端存儲前言應用允許使用瀏覽器提供的實現將數據存儲到用戶的電腦上，這種客戶端存儲相當于賦予了瀏覽器記憶功能。鍵被更改之前的值限制對于和的存儲限制因瀏覽器而異。最初是在客戶端用于存儲會話信息的。淺談前端存儲前言 web應用允許使用瀏覽器提供的API實現將數據存儲到用戶的電腦上，這種客戶端存儲相當于賦予了Web瀏覽器記憶功能。客戶端存儲遵循同源策略，因此不同站點的頁面是無法相互讀...

whidy 2019-08-19 18:24 評論0 收藏0
淺談網站性能之前端性能優化

摘要：淺談網站性能之前端性能優化性能優化的目的無非是減少用戶流量消耗，提升用戶首屏體驗，提升用戶訪問速度，讓用戶專注內容本身。前端性能優化減少請求數量基本原理在瀏覽器與服務器進行通信時，主要是通過進行通信。最近項目慢慢走上正軌，需求趨于平穩，這才想起需要對整站進行性能優化。經過一段時間的學習，結合現在項目的實際性能情況，發現確實有許多地方可以進行優化。于是就開始了我的前端性能優化之旅。以下...

Winer 2019-08-20 11:04 評論0 收藏0
淺談網站性能之前端性能優化

摘要：淺談網站性能之前端性能優化性能優化的目的無非是減少用戶流量消耗，提升用戶首屏體驗，提升用戶訪問速度，讓用戶專注內容本身。前端性能優化減少請求數量基本原理在瀏覽器與服務器進行通信時，主要是通過進行通信。最近項目慢慢走上正軌，需求趨于平穩，這才想起需要對整站進行性能優化。經過一段時間的學習，結合現在項目的實際性能情況，發現確實有許多地方可以進行優化。于是就開始了我的前端性能優化之旅。以下...

philadelphia 2019-08-01 15:44 評論0 收藏0
淺談http協議（一）：與緩存相關的頭信息Etag、Last-Modified、Cache-Cont

摘要：協商緩存用戶發送的請求，發送到服務器后，由服務器判定是否從緩存中獲取資源。如果想主動清除緩存，也可以在請求頭信息中加入來禁止緩存。主要取值如下緩存的時效由決定。是的字段，而是的字段，當與同時存在時，的優先級要高于。在講這幾個屬性之前，先復習下瀏覽器的緩存機制，再結合了解一下Last-Modified / If-Modified-Since、Etag / If-Match、cache-...

FuisonDesign 2019-08-26 13:58 評論0 收藏0