JavaScript运行解析（一）_js解释运行-优快云博客

概述

javascript是单线程的解释性语言，单线程就是先执行完一个，再执行另一个，解释性语言就是先翻译一行，再执行一行，先翻译一行，再执行一行，但是js在执行之前通常会先通篇扫描一遍代码，而不执行代码，通篇扫描就是看看代码有没有什么低级语法错误，这个过程（通篇扫描）就叫语法（义）分析，而在通篇扫描完成之后，才真正开始预编译过程，最后才开始解释一行，执行一行，解释一行，执行一行
js运行3部曲语法分析、预编译、解释执行

function fn  (a){
	console.log(a);
	var a =111;
	console.log(a);
	function a(){}
	console.log(a);
	var b =function(){}
	console.log(b);
	function d(){}
}
fn(1)

预编译

预编译就是把函数参数，变量声明，函数声明提升到逻辑的最前面,发生在函数执行的前一刻

第一步
创建执行上下文
每当函数执行时，会创建一个称为执行上下文的内部对象（可理解为作用域）。一个执行上下文定义了一个函数执行时的环境。(执行一次，创建一次)
（1）创建作用域链（Scope Chain）。
（2）创建变量对象（函数的形参、函数声明、变量声明）。
（3）求”this“的值。

例子：创建AO（执行上下文）

AO{

}

第二步
找形参和变量声明，将变量和形参名作为AO属性名，值为undefined

AO{
	a :undefined
	b :undefined
}

第三步
将形参值和实参相统一，将实参的值赋予形参（a的undefind值被覆盖为1）

AO{
	a :1
	b :undefined
}

第四步
在函数体里面找函数声明，值赋予函数体

AO{
	a :function a(){}
	b :undefined
	d:function d(){}
}

执行阶段

AO对象创建完后，开始执行上面函数

function fn  (a){
	console.log(a); // :function a(){}
	var a =123;
	console.log(a); //123
	function a(){}
	console.log(a); //123
	var b =function(){}
	console.log(b);  //:function (){}
	function d(){}
}
fn(1)