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深入之执行上下文栈》中讲到，当 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

总结

前言

思考题

具体执行分析

您的项目需求