資訊專欄INFORMATION COLUMN
摘要：作用域鏈保證對環(huán)境中定義的變量和函數(shù)的有序訪問。通俗來說，執(zhí)行環(huán)境和作用域就是變量或函數(shù)有效執(zhí)行所在的一個(gè)環(huán)境。總結(jié)要想搞清作用域，首先要搞清預(yù)解析，然后判斷作用域范圍，先判斷本層環(huán)境有無聲明及賦值，如果有聲明，則判斷調(diào)用前是否賦值。
這幾天看了一下JS高級程序設(shè)計(jì)里的介紹作用域的章節(jié)，也參考了網(wǎng)上的資料，現(xiàn)在結(jié)合著自己的理解，給大家分享一下我自己對JS作用域的理解。
作用域及執(zhí)行環(huán)境這里有三個(gè)重要的概念：執(zhí)行環(huán)境、作用域、變量對象
（JS高級程序設(shè)計(jì)解釋）
執(zhí)行環(huán)境 ：定義變量或函數(shù)可訪問的其他數(shù)據(jù)，來決定它們的行為。
變量對象 ：保存執(zhí)行環(huán)境中定義的變量和函數(shù)。
作用域鏈 ：保證對環(huán)境中定義的變量和函數(shù)的有序訪問。
通俗來說，執(zhí)行環(huán)境和作用域就是變量或函數(shù)有效執(zhí)行所在的一個(gè)環(huán)境。
總結(jié)一下這三者的關(guān)系：每個(gè)執(zhí)行環(huán)境執(zhí)行時(shí)都會(huì)產(chǎn)生一個(gè)作用域，作用域前端都有一個(gè)變量對象來保存環(huán)境中的變量和函數(shù)。
知道這3個(gè)重要概念后，要想搞清作用域，就要先清楚JS程序的預(yù)解析過程：
JS程序開始執(zhí)行時(shí)會(huì)先解析語法（檢查錯(cuò)誤等等）、解析內(nèi)存，然后把function、var解析到變量對象里。
這里注意解析var變量時(shí)只是會(huì)把變量名稱解析，而等到程序運(yùn)行到變量賦值時(shí)才會(huì)向變量賦值。
var a="A";
function test(){
console.log(a);//undefined
var a="B";
}
test();
這段代碼的第一個(gè)console.log之所以會(huì)是undefined，原因是函數(shù)內(nèi)部的a變量在預(yù)解析時(shí)已經(jīng)被解析到變量對象里，但沒被賦值。所以函數(shù)執(zhí)行時(shí)找到函數(shù)里未被賦值的a變量，輸出undefined。
搞清楚預(yù)解析后，在判斷作用域范圍：
因?yàn)樽饔糜虻牟檎翼樞蚴怯删植孔饔糜蛞徊讲降赝险?，直到找到聲明的變量和函?shù)或已經(jīng)到了全局作用域。所以局部的作用域可以訪問到外部作用域的變量，而外部作用域訪問不到內(nèi)部作用域的變量。
var a="A";
function test(){
console.log(a);//“A”
a="B";
}
test();
console.log(a);//"B"
function test(){
b();//函數(shù)b會(huì)被預(yù)解析，因此可以調(diào)用，執(zhí)行了輸出1；
var a=1;
function b(){
console.log(1);
console.log(a);//undefined
var a=2;
}
}
test();
以上例子參考網(wǎng)上資料。
總結(jié)要想搞清作用域，首先要搞清預(yù)解析，然后判斷作用域范圍，先判斷本層環(huán)境有無聲明及賦值，如果有聲明，則判斷調(diào)用前是否賦值。如果找不到聲明，則一層層往外部的作用域找，直到全局環(huán)境也找不到時(shí)，通常就會(huì)報(bào)錯(cuò)。
如果有解釋的不對或不清晰的，歡迎留言討論。
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/93638.html
摘要：淺談前端存儲(chǔ)前言應(yīng)用允許使用瀏覽器提供的實(shí)現(xiàn)將數(shù)據(jù)存儲(chǔ)到用戶的電腦上，這種客戶端存儲(chǔ)相當(dāng)于賦予了瀏覽器記憶功能。鍵被更改之前的值限制對于和的存儲(chǔ)限制因?yàn)g覽器而異。最初是在客戶端用于存儲(chǔ)會(huì)話信息的。 淺談前端存儲(chǔ) 前言 web應(yīng)用允許使用瀏覽器提供的API實(shí)現(xiàn)將數(shù)據(jù)存儲(chǔ)到用戶的電腦上，這種客戶端存儲(chǔ)相當(dāng)于賦予了Web瀏覽器記憶功能。 客戶端存儲(chǔ)遵循同源策略，因此不同站點(diǎn)的頁面是無法相互讀...
摘要：淺談網(wǎng)站性能之前端性能優(yōu)化性能優(yōu)化的目的無非是減少用戶流量消耗，提升用戶首屏體驗(yàn)，提升用戶訪問速度，讓用戶專注內(nèi)容本身。前端性能優(yōu)化減少請求數(shù)量基本原理在瀏覽器與服務(wù)器進(jìn)行通信時(shí)，主要是通過進(jìn)行通信。 最近項(xiàng)目慢慢走上正軌，需求趨于平穩(wěn)，這才想起需要對整站進(jìn)行性能優(yōu)化。經(jīng)過一段時(shí)間的學(xué)習(xí)，結(jié)合現(xiàn)在項(xiàng)目的實(shí)際性能情況，發(fā)現(xiàn)確實(shí)有許多地方可以進(jìn)行優(yōu)化。于是就開始了我的前端性能優(yōu)化之旅。以下...
摘要：淺談網(wǎng)站性能之前端性能優(yōu)化性能優(yōu)化的目的無非是減少用戶流量消耗，提升用戶首屏體驗(yàn)，提升用戶訪問速度，讓用戶專注內(nèi)容本身。前端性能優(yōu)化減少請求數(shù)量基本原理在瀏覽器與服務(wù)器進(jìn)行通信時(shí)，主要是通過進(jìn)行通信。 最近項(xiàng)目慢慢走上正軌，需求趨于平穩(wěn)，這才想起需要對整站進(jìn)行性能優(yōu)化。經(jīng)過一段時(shí)間的學(xué)習(xí)，結(jié)合現(xiàn)在項(xiàng)目的實(shí)際性能情況，發(fā)現(xiàn)確實(shí)有許多地方可以進(jìn)行優(yōu)化。于是就開始了我的前端性能優(yōu)化之旅。以下...
摘要：協(xié)商緩存用戶發(fā)送的請求，發(fā)送到服務(wù)器后，由服務(wù)器判定是否從緩存中獲取資源。如果想主動(dòng)清除緩存，也可以在請求頭信息中加入來禁止緩存。主要取值如下緩存的時(shí)效由決定。是的字段，而是的字段，當(dāng)與同時(shí)存在時(shí)，的優(yōu)先級要高于。 在講這幾個(gè)屬性之前，先復(fù)習(xí)下瀏覽器的緩存機(jī)制，再結(jié)合了解一下Last-Modified / If-Modified-Since、Etag / If-Match、cache-...
閱讀 1062·2019-08-30 12:57
閱讀 2149·2019-08-30 11:11
閱讀 2187·2019-08-29 15:20
閱讀 1879·2019-08-29 14:12
閱讀 3282·2019-08-28 17:51
閱讀 2387·2019-08-26 13:23
閱讀 809·2019-08-26 10:34
閱讀 3870·2019-08-23 12:37
