总是感觉 JavaScript 的基础很差, 说会也会说不会还真就不会, 温故而知新, 最近就开始复习起来, 对解析与执行过程在理解的同时做了笔记有不对的还望批评指教
让我们先上一段代码
这里会弹出 undefined
这里是什么原因呢? 从这里引出学习 JS 的解析与执行过程的学习
在这里分为全局和函数两部分来学习, 两者之间存在一定的差别均分为预处理阶段和执行阶段
全局的预处理阶段:
1 可以称之为创建一个全局的词法环境 LexcialEnvironment 这么一个对象, 它会扫描整个全局的 JS 代码里面的两个部分: 用声明的方法创建的函数用 var 定义的变量扫描完之后会把创建完成的变量的名字和函数的名字加到全局的词法环境中去
比如:
这里创建一个 a , 就会放放到环境中去, a : undefined 闯将一个函数也放进去, xxx : 对函数的一个引用
这里说明必须是上面提到的两种情况 (加粗) 像 var g = function (){} // 函数表达式的形式 不进行扫描同理 c = 5; 这种也是不会添加到词法环境中去的
下面可以通过一段简单的代码的运行结果来清晰的理解一下
输出 ffff 之后报错 Uncaught TypeError: g is not a function
这里就是扫描之后 f 存在环境中, 而 g 却不存在会报错这就是上面说的要保证的那两点 (加粗) 同理 var 的代码验证
LexcialEnvironment 顶级的词法环境 <==> window 对象 或者称为上下文对象(全局)
ECMA --262 在标准下 有 VariableEnvironment 等分很多比较细的, 这里不写 JS 解析器的应该不用分得那么清楚
在遇到同名的函数或者同名的变量的时候
出现一次的策略
全局 ----.>预处理阶段 ---->先扫描函数声明后扫描变量(var 声明)
------>处理函数声明冲突时, 会覆盖处理变量冲突时, 会忽略
这两种情况的结果是一样的
函数冲突覆盖, 变量忽略
下面学习的执行阶段
分析: 先加一个成员到词法环境中 f : 指向一份函数, a : undefined ,g : undefined(预处理阶段)
到 alert(b)会报错注释后重新执行依次弹出 undefined function (){console.log("f");}undefined
执行到 var a = 5; 的时候在环境中的 a 赋值为 5; 执行到 b = 6 的时候在词法环境中添加 b : 6; 执行到
- var g = function() {
- console.log("g");
} 会把词法环境中 g : 指向函数
函数部分也是分为预处理阶段和执行阶段
像全局的分类中词法环境可以等价于 window, 但是在函数中不是, 每调用一次, 就产生一个 LexicalEnvironment
来分析一下词法环境
开始的时候执行 f(1,2); 在环境中 a : 1,b : 2 里面还有个特殊 arguments
函数特有的, 可以得到调用函数时实际传入的参数的个数
图:
当执行到 var b = 100;
b 等于 100 被忽略, 然后执行 声明函数 a
函数第一等公民
所以结果输出 a 的函数的字符串表示, b 输出的为 2
执行阶段:
这里写一下第二点的例子
创建 f2 的时候创建了一份词法环境, 但是 b 不能添加到 f2 的词法环境中而是放到它的外部 f1 的外部 window 中
执行之后什么都没有, 但是可以在控制台 window.b 输出 100; 说明放在了 window 的环境中, 这里不能证明是否在 f1 的环境中为什么是最外部 ------------ 作用域那么我去继续复习了
来源: http://www.jianshu.com/p/e1f1375cfb04