JavaScript（7）基礎完結篇

：JavaScript 全局函數
1-1：給大家列舉js常用的幾大全局函數
escape()；eval()；isNan()；isFinite()；parseFloat()；parseInt()；unescape();
Eval()方法；
這里我只講一個：
Eval()方法-它的作用就是用來執行代碼操作；
舉例說明：var a=1+2+1；
eval();
alert(eval（a）)；
那么輸出結果就是4；

其他幾個函數自己練習，學會舉一反三，不然干不了這行哈。
2：JavaScript window 對象常用方法及事件
Alert();彈出消息框
setTimeout()；在規定的時間內彈出提示，只會執行一次
setinterval()；執行多次
open();打開窗口
Window.onload 發生在文檔全部下載完畢的時候。
Window.onresize 發生在窗口大小發生變化的時候

3：至此，js基礎篇知識梳理完，基本這些你都掌握了，結合java基礎，我之前講的h+c，做個畢業設計之類的小項目絕對夠用了，后面我們會講提高篇。用于做大型項目。下一周我們更新mysql數據庫基礎知識。基本的sql語句，增刪改查，左外連接，分組，分頁查詢，索引等等這些都會講到。敬請期待。

每天進步一點點，最后進步一大點。加油
@特此聲明此文為本人在頭條原創文章，任何組織或個人不得以任何盈利為目的進行傳播

TML的Layout布局

頁面設計將全部的structure功能都集中于之中。

<head>
<body>

<header>
<main>

<heading>
<nav>
<paragraph>

<footer>

html結構圖-01

HTML結構圖總結02

html結構圖與word文檔做平行的對比。

<head>就是word的文件名；
<main>是整個頁面
<header>and<footer>是頁眉和頁腳；
文章的兩個核心要素，headings和paragraph
語義化的表達，<aside><nav>
更多的表達力工具，links，lists，forms，最后是images。

html結構圖-02

Murach的總結比其他的教材更為出色。

總結

HTML負責結構，CSS負責裝飾，用html的strucure思路重新思考word的排版。

avaScript深入系列第七篇，結合之前所講的四篇文章，以權威指南的demo為例，具體講解當函數執行的時候，執行上下文棧、變量對象、作用域鏈是如何變化的。

前言

在《JavaScript深入之執行上下文?！分兄v到，當 JavaScript 代碼執行一段可執行代碼(executable code)時，會創建對應的執行上下文(execution context)。

對于每個執行上下文，都有三個重要屬性：

變量對象(Variable object，VO)
作用域鏈(Scope chain)
this

然后分別在《JavaScript深入之變量對象》、《JavaScript深入之作用域鏈》、《JavaScript深入之從ECMAScript規范解讀this》中講解了這三個屬性。

閱讀本文前，如果對以上的概念不是很清楚，希望先閱讀這些文章。

因為，這一篇，我們會結合著所有內容，講講執行上下文的具體處理過程。

思考題

在《JavaScript深入之詞法作用域和動態作用域》中，提出這樣一道思考題：

var scope="global scope";
function checkscope(){
    var scope="local scope";
    function f(){
        return scope;
    }
    return f();
}
checkscope();

var scope="global scope";
function checkscope(){
    var scope="local scope";
    function f(){
        return scope;
    }
    return f;
}
checkscope()();

兩段代碼都會打印'local scope'。雖然兩段代碼執行的結果一樣，但是兩段代碼究竟有哪些不同呢？

緊接著就在下一篇《JavaScript深入之執行上下文棧》中，講到了兩者的區別在于執行上下文棧的變化不一樣，然而，如果是這樣籠統的回答，依然顯得不夠詳細，本篇就會詳細的解析執行上下文棧和執行上下文的具體變化過程。

具體執行分析

我們分析第一段代碼：

var scope="global scope";
function checkscope(){
    var scope="local scope";
    function f(){
        return scope;
    }
    return f();
}
checkscope();

執行過程如下：

1.執行全局代碼，創建全局執行上下文，全局上下文被壓入執行上下文棧

    ECStack=[
        globalContext
    ];

2.全局上下文初始化

    globalContext={
        VO: [global, scope, checkscope],
        Scope: [globalContext.VO],
        this: globalContext.VO
    }

2.初始化的同時，checkscope 函數被創建，保存作用域鏈到函數的內部屬性[[scope]]

    checkscope.[[scope]]=[
      globalContext.VO
    ];

3.執行 checkscope 函數，創建 checkscope 函數執行上下文，checkscope 函數執行上下文被壓入執行上下文棧

    ECStack=[
        checkscopeContext,
        globalContext
    ];

4.checkscope 函數執行上下文初始化：

復制函數 [[scope]] 屬性創建作用域鏈，
用 arguments 創建活動對象，
初始化活動對象，即加入形參、函數聲明、變量聲明，
將活動對象壓入 checkscope 作用域鏈頂端。

同時 f 函數被創建，保存作用域鏈到 f 函數的內部屬性[[scope]]

    checkscopeContext={
        AO: {
            arguments: {
                length: 0
            },
            scope: undefined,
            f: reference to function f(){}
        },
        Scope: [AO, globalContext.VO],
        this: undefined
    }

5.執行 f 函數，創建 f 函數執行上下文，f 函數執行上下文被壓入執行上下文棧

    ECStack=[
        fContext,
        checkscopeContext,
        globalContext
    ];

6.f 函數執行上下文初始化, 以下跟第 4 步相同：

復制函數 [[scope]] 屬性創建作用域鏈
用 arguments 創建活動對象
初始化活動對象，即加入形參、函數聲明、變量聲明
將活動對象壓入 f 作用域鏈頂端

    fContext={
        AO: {
            arguments: {
                length: 0
            }
        },
        Scope: [AO, checkscopeContext.AO, globalContext.VO],
        this: undefined
    }

7.f 函數執行，沿著作用域鏈查找 scope 值，返回 scope 值

8.f 函數執行完畢，f 函數上下文從執行上下文棧中彈出

    ECStack=[
        checkscopeContext,
        globalContext
    ];

9.checkscope 函數執行完畢，checkscope 執行上下文從執行上下文棧中彈出

    ECStack=[
        globalContext
    ];

第二段代碼就留給大家去嘗試模擬它的執行過程。

var scope="global scope";
function checkscope(){
    var scope="local scope";
    function f(){
        return scope;
    }
    return f;
}
checkscope()();

不過，在下一篇《JavaScript深入之閉包》中也會提及這段代碼的執行過程。

---------轉自冴羽

在線咨詢

上一篇：從零開始學Vue-vue模板和組件
下一篇：07-文件上傳到阿里云OSS實戰（二）

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商

JavaScript（7）基礎完結篇

TML的Layout布局

HTML結構圖總結02

總結

前言

思考題

具體執行分析

您的項目需求