预编译、作用域链和闭包理解

在理解预编译之前，首先了解一下JS的解析过程：JS引擎在解析脚本的过程分为两个阶段，预编译和执行，首先预编译然后再从上之下一行一行的执行代码。其次，要了解作用域，作用域是一个变量或者函数能够使用的空间，分为全局作用域和局部作用域，全局变量的作用域为全局作用域，局部变量（函数内部或者ES6块内部的变量）的作用域为局部作用域。

预编译分为全局预编译和函数预编译，我们来详细的了解一下。

全局预编译分为两步：

1.生成全局对象：（Global Object） GO = { }；

2.找变量声明和关键字函数，将变量名和函数名作为GO的属性，变量声明的属性值为undefined，关键字函数的属性值为函数体；

这里需要特别注意的是：

在全局的变量声明必须是var 关键字的变量声明，ES6中let和const并不会变量提升；
函数必须是function关键字定义的函数；
函数体内部没有任何关键字的变量也会提升到全局对象中；
函数的权限大于变量，当同名时函数会覆盖变量，不关前后出现顺序；

Eg:

函数与变量同名时GO对象的对比

接下来我们来了解函数预编译，函数的预编译相对复杂一点。函数的预编译发生在函数执行的前一刻，或者说函数执行时首先进行预编译。

函数预编译分为四步：

创建activation Object（执行期上下文），AO对象；
找形参和变量声明，将形参名和变量名作为AO对象的属性，属性值为undefined；
将形参值和实参值统一；
在函数体内找关键字函数（function关键字定义的子函数），将函数名作为AO对象的属性，属性值为函数体；
函数执行完以后会销毁自己的执行期上下文。

这里需要特别注意的是：

实参和形参值统一在关键字函数之前，函数的权限比变量大，因此形参和子函数同名时也会被覆盖。

Eg:

接下来我们来详细的了解作用域链：

先将本文最初的一句话复制下来了回顾一下：作用域是一个变量或者函数能够使用的空间，分为全局作用域和局部作用域，全局变量的作用域为全局作用域，局部变量（函数内部或者ES6块内部的变量）的作用域为局部作用域。

然后我们了解作用域链：

Js中函数自身也是个对象，函数对象自身有一个属性scope，scope中存储着函数执行期上下文对象的集合，这个对象成链式链接，这也就是函数的作用域链。

全局函数在声明提升时将全局的GO放入自己的scope,然后执行时放入自己的AO。

局部函数在声明提升时先将父级的scope放入自身的scope中，然后在执行时将自己的AO放入scope。注意对象的存储是堆存储，指向关系，内存中GO只有一个，函数及子函数指向GO只是在栈中创造空间，将GO的索引存入。子函数存储父级的scope也相同。函数执行完成后销毁自身的执行期上下文AO,但是声明提升时放入scope中的内容并不会销毁。

最后我们了解一下闭包：

理解了上文的作用域链之后就很好理解闭包了。闭包的一个特点就是在函数内部返回一个函数。因此被返回的函数自身的scope中已经存储了父级的scope，当父级执行完成后销毁自身的执行期上下文时，对被返回的函数并无作用，因为其自身的scope中已经备份了一份。所以被返回的函数可以访问其父级的变量。

转载于:https://www.cnblogs.com/baibai123/p/9060991.html

预编译、作用域链和闭包理解相关推荐

JavaScript作用域、上下文、执行期上下文、作用域链、闭包
作用域.上下文.执行期上下文.作用域链.闭包是JavaScript中关键概念之一,是JavaScript难点之一,在应聘面试时必定会问到的问题,作为前端工程师必须理解和掌握.相信大家已经阅读了很多 ...
JavaScript重难点解析4（作用域与作用域链、闭包详解）
JavaScript重难点解析4(作用域与作用域链.闭包详解) 作用域与作用域链作用域作用域与执行上下文作用域链闭包闭包理解将函数作为另一个函数的返回值将函数作为实参传递给另一个函数调用 ...
在chrome开发者工具中观察函数调用栈、作用域链、闭包
在chrome的开发者工具中,通过断点调试,我们能够非常方便的一步一步的观察JavaScript的执行过程,直观感知函数调用栈,作用域链,变量对象,闭包,this等关键信息的变化.因此,断点调试对于快 ...
Javascript的作用域，作用域链，闭包
1,作用域和作用域链概念作用域就是变量与函数的可访问范围,即作用域控制着变量与函数的可见性和生命周期.在JavaScript中,变量的作用域有全局作用域和局部作用域两种. 1.1 全局作用域,在代码 ...
如何延长作用域链_第4部分2：作用域(链)和闭包
知识列表作用域/作用域链闭包(涉及JS垃圾回收机制 )https://zhuanlan.zhihu.com/p/27110726 [ js 基础 ][读书笔记]作用域和闭包https://jueji ...
面试之作用域链与闭包
闭包有多重要?如果你是初入前端的朋友,我没有办法直观的告诉你闭包在实际开发中的无处不在,但是我可以告诉你,前端面试,必问闭包.面试官们常常用对闭包的了解程度来判定面试者的基础水平,保守估计,10个前端 ...
javaScript执行环境、作用域链与闭包
一.执行环境执行环境定义了变量和函数有权访问的其他数据,决定了他们各自的行为:每个执行环境都有一个与之关联的变量对象,环境中定义的所有变量和函数都保存在这个对象中.虽然我们编写的代码无法访问这个对象 ...
图解Javascript——作用域、作用域链、闭包
什么是作用域? 作用域是一种规则,在代码编译阶段就确定了,规定了变量与函数的可被访问的范围.全局变量拥有全局作用域,局部变量则拥有局部作用域. js是一种没有块级作用域的语言(包括if.for等语句的 ...
一文彻底搞懂执行上下文、VO、AO、Scope、[[scope]]、作用域链、闭包
目录 0.写在开头 1.执行上下文 2.VO 3.AO 4.Scope 5.闭包 0.写在开头本文将秉承能写代码就不多BB的原则,争取将执行上下文.VO.AO.Scope.[[scope]].作用域 ...

预编译、作用域链和闭包理解

预编译、作用域链和闭包理解相关推荐

最新文章

热门文章