js中的執行環境及作用域

来源:http://www.cnblogs.com/pwei/archive/2016/03/30/js-scope.html
-Advertisement-
Play Games

最近在面試時被問到了對作用域鏈的理解,感覺當時回答的不是很好,今天就來說說js中的作用域鏈吧。 首先來說說js中的執行環境,所謂執行環境(有時也稱環境)它是JavaScript中最為重要的一個概念。執行環境定義了變數或函數有權訪問的其他數據 ,決定了它們各自的行為。而每個執行環境都有一個與之相關的變 ...


最近在面試時被問到了對作用域鏈的理解,感覺當時回答的不是很好,今天就來說說js中的作用域鏈吧。

首先來說說js中的執行環境,所謂執行環境(有時也稱環境)它是JavaScript中最為重要的一個概念。執行環境定義了變數或函數有權訪問的其他數據 ,決定了它們各自的行為。而每個執行環境都有一個與之相關的變數對象,環境中定義的所有變數和函數都保存在這個對象中。

理解了執行環境,現在就看看什麼是作用域鏈吧。每個函數都有自己的執行環境,當代碼在執行環境中執行時,就會創建變數對象的作用域鏈。作用域鏈保證了對執行環境有權訪問所有變數和函數的有序訪問。作用域鏈的前端,始終都是當前執行的代碼所在的環境的變數對象,如果環境是一個函數,那麼它的變數對象就是該函數的活動對象。作用域鏈的下一個變數對象來自包含(外部)環境,再下一個變數對象來自下一個包含環境。這樣一直延續到全局執行環境,記住,全局執行環境的變數對象永遠是作用域中的最後一個對象。

請看下麵的例子:

var scope="global";
function foo(){
    console.log(scope);
}    
foo();

在這個例子中,函數foo()的作用域鏈包含了兩個對象,一個是它自身對象,另一個是全局環境中的變數對象。因為我們可以在這個作用域鏈中找的scope,所以可以在函數內部里訪問到它。

在看一個例子:

var color = "blue";
function changeColor(){
    var anoterColor = "red";
    function swapColor(){
        var tempColor = anoterColor;
        anoterColor = color;
        color = tempColor;
        console.log(color);
    }
    swapColor();
}
changeColor();

在這個例子中,有三個執行環境:全局環境、changeColor()的局部環境和swapColor()局部環境。我們來看看這個例子的作用域鏈是怎樣的吧。

圖中的矩形表示特定的執行環境。我們可以看到變數tempColor只能在swapColor()環境中訪問到,而在changeColor()的局部環境還是全局環境中都無法訪問到它。因此我們可以得到一個結論:內部的環境可以通過作用域鏈訪問所有的外部環境,但外部的環境無法訪問內部的環境中的任何變數和函數。每個環境都可以向上搜索作用域鏈,以查詢變數和函數名;但是任何環境都不能通過向下搜索作用域而進入另一個執行環境。

作用域中我還想說說的是:js沒有塊級作用域

為什麼說js沒有塊級作用域呢?我們來看下麵的代碼:

 

if(true){
  var color = "blue";  
}
alert(color);    //"blue"

 

咦,為什麼color在if語句執行完畢後被銷毀呢?哈哈,如果在C、C++或Java中,color確實會被銷毀,但在JavaScript中,if語句中的變數聲明會將變數添加到當前的執行環境中(在這裡是全局環境)中。特別地,在for語句時要牢記這一差異,例如:

for(var i = 0;i< 10; i++){
doSomething(i);
}
alert(i);       //10

記住:在JavaScript中,由for語句創建的變數i即使在for迴圈執行結束之後,也依然會存在於迴圈外部的執行環境中喲。

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 原文地址:http://www.infoq.com/cn/articles/flash-deal-architecture-optimization 一、秒殺業務為什麼難做 IM系統,例如QQ或者微博,每個人都讀自己的數據(好友列表、群列表、個人信息)。 微博系統,每個人讀你關註的人的數據,一個人讀 ...
  • 單例模式(Singleton) 類圖 描述 單例模式: 保證一個類僅有一個實例,並提供一個訪問它的全局訪問點; 構造函數修飾符為private。 應用場景 懶漢模式:第一次調用的時候才產生一個新的實例,併在以後返回此實例。 非線程安全的單例模式 線程安全的單例模式,需加線程鎖 線程安全的單例模式,雙 ...
  • 1、在MyEclipse下建立Web Project,找到根目錄建立Database文件夾和Doc文件夾,Database用於保存資料庫信息,Doc用於保存資料庫表信息。 2、打開SQL Server 2008 ,新建資料庫CRUD,將路徑添加到Database文件夾下。 3、寫SQL語句添加資料庫 ...
  • 來到了開源中國的第二個星期,雖然只是實習,但是數了數,這也是我大學生涯裡面的第四個實習工作了。 專業學的是軟體工程,然而課程裡面卻沒有一門課程是直接跟前端相關的。因此在大學期間,只能靠實習來學習,獲得經驗,每當技術在該公司遇到瓶頸的時候,我就知道,我要準備去另一家公司實習了~~誰叫我現在才大三呢.. ...
  • 網上看過很多配置思路,自己總結了以下, 就把我個人配置的順序以及材料分享下,webstrom以下簡稱WB 1、配置less需要安裝nodejs,自行安裝。因為要用到npm.我是直接把npm解壓到C盤根目錄的,先下載解壓好待用 npm解壓包百度雲下載地址:http://pan.baidu.com/s/ ...
  • Make use of Bootstrap's modal more monkey-friendly. 參考地址:http://nakupanda.github.io/bootstrap3-dialog/ 模態彈框: <div class="modal fade"> <div class="moda ...
  • 轉載自百度文庫 http://wenku.baidu.com/view/9a703522bcd126fff7050bfa.html 1. oncontextmenu="window.event.returnValue=false" 將徹底屏蔽滑鼠右鍵<table border oncontextme ...
  • 偶然看到一篇類似css技巧與經驗總結的文章,其中有一部分非常熟悉,那就是“css控制元素內文本超出部分使用省略號代替”,一般實際工作中, 很多產品經理會對頁面UI有這樣的要求。還記得,第一次做這個功能時,是通過百度到的,然後就是一勞永逸,直接記事本記錄下來,以後基本上 就是拿來主義,根本就沒有去研究 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...