国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

深入理解 Javascript 之 JS的解析與執(zhí)行過程

amuqiao / 1472人閱讀

摘要：的解析與執(zhí)行過程第一個彈出函數(shù)體第二個彈出函數(shù)體第三個彈出第四個彈出第五個彈出最后一行報(bào)錯執(zhí)行分析第行，沒有關(guān)鍵字，不解析第行，遇到關(guān)鍵字，解析到全局的頭部第行，沒有關(guān)鍵字，不解析第行，遇到關(guān)鍵字，解析到全局的頭部第行，沒有關(guān)鍵

js的解析與執(zhí)行過程 

alert(a);
function a(){ alter(2); }
alert(a);
var a = 1
alert(a);
var a = 3;
alert(a);
function a(){ alter(4); }
alert(a);
a();
- 第一個 alert(a)  彈出 function a(){ alter(4); } 函數(shù)體
- 第二個 alter(a)  彈出 function a(){ alter(4); } 函數(shù)體
- 第三個 alter(a)  彈出 1
- 第四個 alter(a)  彈出 3
- 第五個 alter(a)  彈出 3
- 最后一行報(bào)錯 a is not a function

執(zhí)行分析

// 第1行，沒有關(guān)鍵字 ， 不解析
// 第2行，遇到 function 關(guān)鍵字，解析到全局的頭部
a = function a(){ alter(2); }
// 第3行，沒有關(guān)鍵字 ， 不解析
// 第4行，遇到關(guān)鍵字 var ， 解析到全局的頭部
a = undefined
// 第5行，沒有關(guān)鍵字 ， 不解析
// 第6行，遇到關(guān)鍵字 var ， 解析到全局的頭部
a = undefined
// 第8行，遇到 function 關(guān)鍵字，解析到全局的頭部
a = function a(){ alter(4); }
// 第9行，沒有關(guān)鍵字 ， 不解析
// 第10行，a() 函數(shù)調(diào)用
此時這里有4個同名變量 a ，依循規(guī)則是：function 優(yōu)先與 var, 同名的后面覆蓋前面的
因此，a = function a(){ alter(2); } 替換掉下面的2個 a = undefined ，a = function a(){ alter(4); } 又替換掉 a = function a(){ alter(2); } ,最終只剩下 a = function a(){ alter(4); }

接下來我們進(jìn)入正題哦

一、 全局預(yù)處理和執(zhí)行 1.1、全局預(yù)處理階段

實(shí)例0

var a = 5;
var b ;
function xxx(){
  // 用聲明的方式創(chuàng)建的函數(shù)
}
var fun = function () {
  // 用函數(shù)表達(dá)式創(chuàng)建的函數(shù)
}
c = 5;  // 不會報(bào)錯，但是也不會加入詞法環(huán)境
假設(shè)全局我們創(chuàng)建了上訴的內(nèi)容

首先js會創(chuàng)建一個詞法環(huán)境對象LexicalEnviroment,全局下等同于我們的window；

// 創(chuàng)建詞法環(huán)境如下
LexicalEnviroment{
  a: undefined
  b: undefined
  xxx: 該函數(shù)的引用
  fun: undefined
}

// 這里有著變量提升的知識

實(shí)例1

f(); // ff
g(); // 報(bào)錯： g is not a function

function f(){
  console.log("ff");
}
var g = function() {
  // 
}

// 【解析】
// 因?yàn)樵~法環(huán)境中f存在引用，g確實(shí)是undefined，因此當(dāng)在為g賦值之前調(diào)用g會報(bào)錯。

實(shí)例2

console.log(a); // undefined
console.log(b); // 報(bào)錯： b is not defined
var a = 1;
b = 4;

實(shí)例3 變量重名

// 處理函數(shù)聲明沖突 => 覆蓋
alert(f);
var f = 0;
function f() {
  cosole.log("f");
}
// 執(zhí)行結(jié)果： 彈出一個f函數(shù)的字符串


// 處理變量聲明沖突  => 忽略
alert(f);
function f() {
  cosole.log("f");
}
var f = 0;
// 執(zhí)行結(jié)果： 彈出一個f函數(shù)的字符串

// 【解析】
//  可見不是根據(jù)最后出現(xiàn)的覆蓋前面的
1.2、全局執(zhí)行階段

實(shí)例 4

alert(a);
alert(b);
alert(f);
alert(g);


var a = 5;
b = 6;
alert(b);
function f() {
  console.log("f");
}
var g = function () {
  console.log("g);
}
alert(g);

執(zhí)行過程如下

1. 構(gòu)建詞法環(huán)境
2. 詞法環(huán)境如下
{
  f: function () {console.log("f")}
  a: undefined
  g: undefined
}
3. 開始執(zhí)行
4. alert(a); // undefined
5. alert(b); // 報(bào)錯： b is not defined
6. alert(f); // function () {console.log("f")}
7. alert(g); // undefined
8. a = 5;  b = 6                                  [window下的變量賦值]
9. alert(b); // 6
10. g = function () {console.log("g);}            [window下的變量賦值]
11. alert(g); // function () {console.log("g);}

// 最后的詞法環(huán)境如下（window）
{
  f: function () {console.log("f")}
  a: 5
  g: function () {console.log("g);}   
  b: 6
}
二、 函數(shù)預(yù)處理和執(zhí)行 2.1、函數(shù)預(yù)處理階段 + 執(zhí)行階段

實(shí)例 5

function f(a, b) {
  alert(a);
  alert(b);

  var b = 10;
  function a() {
    //
  }
}

f(1,2);

執(zhí)行分析

1. 1. 構(gòu)建詞法環(huán)境
2. 詞法環(huán)境如下
{
  a: 最初是1， 因?yàn)闆_突，最后變成了 函數(shù)的引用 function a() {// }
  b: 2

}
3. 開始執(zhí)行
4. alert(a); // function a() {// }
5. alert(b); // 2

實(shí)例 6

函數(shù)內(nèi)部如果沒有用var聲明的變量，會成為最外部的詞法環(huán)境的變量（也就是全局了）

function a() {
  function b() {
    c = 100;
  }
  b();
}

a();

// window.c === 100

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

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/96755.html

相關(guān)文章

  • JS編譯之 LHS RHS（你不知道的JavaScript 小記一）

    摘要：關(guān)于兩個專業(yè)術(shù)語的討論起自對你不知道的一書的閱讀學(xué)習(xí)。遇到，編譯器會詢問作用域是否已經(jīng)有一個該名稱的變量存在于同一個作用域的集合中。摘錄來自你不知道的。 JS 編譯之 LHS RHS 一、前言 最近和朋友聊技術(shù)的時候，聊到 LHS RHS，我竟然沒聽說過 沒聽說過。。。 于是成功引起了我的好奇心。 關(guān)于兩個專業(yè)術(shù)語的討論起自對《你不知道的JavaScript》一書的閱讀學(xué)習(xí)。 二、編譯...

    Cristic 評論0 收藏0

  • 【進(jìn)階1-2期】JavaScript深入之執(zhí)行上下文棧和變量對象

    摘要：本計(jì)劃一共期，每期重點(diǎn)攻克一個面試重難點(diǎn)，如果你還不了解本進(jìn)階計(jì)劃，點(diǎn)擊查看前端進(jìn)階的破冰之旅本期推薦文章深入之執(zhí)行上下文棧和深入之變量對象，由于微信不能訪問外鏈，點(diǎn)擊閱讀原文就可以啦。 （關(guān)注福利，關(guān)注本公眾號回復(fù)[資料]領(lǐng)取優(yōu)質(zhì)前端視頻，包括Vue、React、Node源碼和實(shí)戰(zhàn)、面試指導(dǎo)） 本周正式開始前端進(jìn)階的第一期，本周的主題是調(diào)用堆棧，今天是第二天。 本計(jì)劃一共28期，每期...

    Richard_Gao 評論0 收藏0

  • 《Webkit技術(shù)內(nèi)幕》之頁面渲染過程

    摘要：文章同步到技術(shù)內(nèi)幕之頁面渲染過程最近拜讀了傳說中的技術(shù)內(nèi)幕一書，有很大收獲，尤其是對頁面渲染有了較深的認(rèn)識。解析語法分析，基于詞法解釋器生成的新標(biāo)記，構(gòu)建成抽象語法樹，解析器嘗試將其與某條語法規(guī)則進(jìn)行匹配。 文章同步到github《Webkit技術(shù)內(nèi)幕》之頁面渲染過程 最近拜讀了傳說中的《Webkit技術(shù)內(nèi)幕》一書，有很大收獲，尤其是對頁面渲染有了較深的認(rèn)識。由于功力有限，而且書中設(shè)...

    vvpvvp 評論0 收藏0

  • 《Webkit技術(shù)內(nèi)幕》之頁面渲染過程

    摘要：文章同步到技術(shù)內(nèi)幕之頁面渲染過程最近拜讀了傳說中的技術(shù)內(nèi)幕一書，有很大收獲，尤其是對頁面渲染有了較深的認(rèn)識。解析語法分析，基于詞法解釋器生成的新標(biāo)記，構(gòu)建成抽象語法樹，解析器嘗試將其與某條語法規(guī)則進(jìn)行匹配。 文章同步到github《Webkit技術(shù)內(nèi)幕》之頁面渲染過程 最近拜讀了傳說中的《Webkit技術(shù)內(nèi)幕》一書，有很大收獲，尤其是對頁面渲染有了較深的認(rèn)識。由于功力有限，而且書中設(shè)...

    adam1q84 評論0 收藏0

  • 《Webkit技術(shù)內(nèi)幕》之頁面渲染過程

    摘要：文章同步到技術(shù)內(nèi)幕之頁面渲染過程最近拜讀了傳說中的技術(shù)內(nèi)幕一書，有很大收獲，尤其是對頁面渲染有了較深的認(rèn)識。解析語法分析，基于詞法解釋器生成的新標(biāo)記，構(gòu)建成抽象語法樹，解析器嘗試將其與某條語法規(guī)則進(jìn)行匹配。 文章同步到github《Webkit技術(shù)內(nèi)幕》之頁面渲染過程 最近拜讀了傳說中的《Webkit技術(shù)內(nèi)幕》一書，有很大收獲，尤其是對頁面渲染有了較深的認(rèn)識。由于功力有限，而且書中設(shè)...

    forsigner 評論0 收藏0

發(fā)表評論

0條評論

amuqiao

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<