JavaScript:从内存的角度图解 函数作用域及作用域链

一、作用域 (scope):一个变量的使用范围

(1)全局作用域:既是指全局变量,其特点是可反复使用,缺点是使用不当极易造成全局污染。
(2)函数作用域:既是指局部变量,其特点是只在函数体内部有效,函数调用结束,该变量生命周期也随之结束。缺点是不可反复使用。

二、函数作用域下的函数生命周期

以下代码为例:

	var a;
	function fun(){
		function text(){
			// to much coding
		}
		text();	
	}
	fun();
(1)函数开始执行前,创建执行环境栈(ECS)调用主函数(main()),主函数创建全局作用的对象window。

这是开始执行前的环境
在这里插入图片描述

(2) window 预编译(全局作用域)

在这里插入图片描述

(3)window内的函数开始执行

① fun 函数定义:创建函数对象(这里首先被window已声明的函数是fun),fun指向引用函数对象,函数对象的scope属性引用回创建函数时的作用域(这里的fun函数对象引用回的是window)
在这里插入图片描述
② fun 函数调用:声明及引用完毕,程序执行到 fun( )时,既是 fun( ) 被调用,这意味着ECS中将开辟一个新的元素(新的函数执行环境)fun( ) ,fun( ) 随即创建一个属于自己的活动对象(AO),并指向该活动对象,该活动对象中存储的则是fun( )中的局部变量或新的函数体(这里是fun( )的内部函数text( )),活动对象中的parent属性引用函数的scope属性指向父级作用域(这里即是window)。
在这里插入图片描述
③ text 函数定义:和 ① 类似,这里的text指向引用函数对象,函数对象的scope属性引用回创建函数时的作用域(既是 fun)
在这里插入图片描述
④ text 函数调用:同上 ② 类似,程序执行到 text( )时,既 test( ) 被调用 ,test( ) 随即创建一个属于自己的活动对象(AO),并指向该活动对象,活动对象中的parent属性引用函数的scope属性指向父级作用域(这里即是fun:AO)。
在这里插入图片描述

(4)window内的函数调用结束

函数执行完毕接下来即是出栈操作,释放活动对象,释放活动对象中的局部变量。也即是局部变量生命周期的结束。
在这里插入图片描述

三、作用域链

函数的作用域链是由多级作用域连续引用形成的链试效果,即是活动对象中的parent属性引用函数的scope属性指向父级作用域,引用顺序:先在局部找,局部没有则沿作用域链向父级作用域中寻找。

scope chain
  1. 每个函数在定义时(函数声明/函数表达式)时会拷贝其父亲函数的作用域链
  2. 在函数调用(运行)时,生成AO然后将AO压入作用域链的栈顶
    在这里插入图片描述
发布了40 篇原创文章 · 获赞 31 · 访问量 2787

猜你喜欢

转载自blog.csdn.net/CodingmanNAN/article/details/103015746