JS预编译

一。了解。JS运行三部曲

预编译：（表象）   1.函数声明 整体提升

                              2.变量声明 声明提升

二。预编译前奏

全部变量：任何变量未经声明就被赋值，就是全局变量。

var a = b = 123;
console.log(a);
console.log(b);

结果：
123
123



解释：
//var a ;
//b=123;
//a=b;   （3）
// b :全局变量

AO{ a:undefined }
GO{ b:123 } 

在执行到   （3）   时，AO中的a被123值覆盖。
这里的AO,GO只是针对执行期上下文而言，即仅仅是预编译过程中值的情况。预编译结束后进行函数的执行，执行过程中的赋值语句会对AO,GO中的变量进行一个覆盖，应该以执行结束后的结果为最终的变量标准。

预编译发生在函数执行的前一刻。

三。预编译的过程（分四步）：

1.创建AO对象（执行期上下文）

2.找形参和变量声明，将变量名和形参名作为AO属性名，初始值为undefined

3.将实参值和形参统一

4.在函数体里面找变量声明，值赋予函数体

注意：这里的AO,GO只是针对执行期上下文而言，即仅仅是预编译过程中值的情况。预编译结束后进行函数的执行，执行过程中的赋值语句会对AO,GO中的变量进行一个覆盖，应该以执行结束后的结果为最终的变量标准。

实例一：

<script type="text/javascript">
		function fn(a){
			console.log(a);
			var a = 123;
			console.log(a);
			function a(){}   
			console.log(a);
			var b = function(){};  //这是一个函数表达式，不是函数声明
			console.log(b);
			function d(){}
		}
		fn(1);
	</script>


运行结果：
ƒ a(){}
123
123
ƒ (){}

解释： 预编译结束时，执行期上下文应该是：
                 AO{
                        a : ƒ a(){} ,
                        b : undefined ,
                        c : ƒ b(){}
                   }
在执行到 var a = 123; 时，a 被123覆盖

 

实例二：这个实例教给大家的知识点是：

AO和GO中都有某一个相同名字的变量时，当用到这个变量的时候，系统会先从AO中进行查找，如果AO中不存在，再去GO中查找该变量。

<script type="text/javascript">
		global = 100;
		function fn(){
			console.log(global); //undefined
			global = 200;
			console.log(global); //200
			var global = 300;
		}
		fn();
		var global;
	</script>

      ->  表示的是在执行环境中变量的变化

	AO{
		global:undefined -> 200 ->300
	}
	GO{
		global:undefined ->100
	}

实例三：  大家看下面这个代码的时候，一些细节性的问题要理解仔细，否则的很容易对自己造成误解，并且容易出错。

所有的  =  操作都是在函数执行时 进行的。在编译过程中不进行，哪怕是全局变量的 = 也是在代码执行过程中才进行赋值操作的。

<script type="text/javascript">
		function text(){
			console.log(b); //undefined
			if(a){
				var b = 100;
			}
			console.log(b);
			//console.log(c);  在这里添加这一行他会报错，c未定义 
			c = 234;        //这里定义了一个全局变量c，函数执行到这一步，赋值234给c
			console.log(c); //234  
		}
		var a;  //这里声明了a，对于text函数来说是一个全局变量。上面全局变量c未声明，所以打印会报错。如果把这一行删除，那么a的打印也会报错。
		text();
		a = 10;
		console.log(c);
	</script>

	AO{
		b:undefined 
	}
	GO{
		a:undefined ->10
		c: undefined ->234
	}