测试技术之javascript 闭包详解
白羽 2019-01-07 来源 :网络 阅读 1057 评论 0

摘要:本文将带你了解测试技术javascript 闭包详解,希望对大家学测试技术有所帮助。

    本文将带你了解测试技术javascript 闭包详解,希望对大家学测试技术有所帮助。



                       

                  


     

  闭包(Closure)是前端开发者经常会听到的一个概念,也是我们在求职面试中经常会遇到的题目之一。透过表象去理解闭包的本质,对前端开发者来说是进阶的必经之路。

  闭包跟执行上下文中的变量对象和作用域链有着千丝万缕的关系,深刻理解变量对象以及作用域链对理解闭包的本质有很大的帮助。

  MDN   中对闭包的定义是:闭包是函数和声明该函数的词法环境的组合。

  我认为 MDN   中对闭包的定义比较抽象以致并不能让我们很清楚地知道闭包是什么东西。在这里我直接给闭包做一个我认为比较本质且好理解(前提当然是你对执行上下文系列已经有相应的了解啦)的定义:闭包是指其所在执行上下文已经出栈,但仍访问了其所在执行上下文变量对象的函数。

  我们经常问,闭包是什么?其实从上述的定义我们可以很简单地知道,闭包是一个函数。但跟普通的函数不一样,闭包是具有特殊能力的函数。

  从上述的定义我们可以知道,闭包具有两个特点,即

  其所在执行上下文已经出栈

  访问了其所在执行上下文变量对象

  这里需要注意的是,「其所在执行上下文」指的是闭包所在函数对应的执行上下文,而不是指闭包本身所对应的执行上下文。

  一个简单的能够产生闭包的例子是,在函数   A 中创建了函数 B 并且返回函数 B,当函数 B 执行时,如果访问了 A   中的变量,则产生了闭包。

   

  在大部分书中,对闭包的概念解释为:能够读取其它函数内部变量的函数。在上述的简单例子中,即以函数   B 指代闭包,在我们平时开发过程中,也经常会以函数 B 来指代闭包。而在 chrome 的开发者工具中,则会以函数 A   指代闭包。

  那么,闭包的本质又是什么呢?

  我们都知道,javascript   拥有自动的垃圾回收机制,当一个值失去引用的时候,垃圾回收机制会根据特殊的算法找到它并将其回收。

  函数的执行上下文在出栈后,其变量对象会失去引用等待被回收,而闭包的存在会阻止这一过程,因为闭包的作用域链包含了其所在执行上下文的变量对象。

  举个例子来说明其中的过程,假设有一个   javascript 文件中包含如下代码

   

  在代码执行过程中,执行上下文栈的行为如下

     

  从执行上下文栈的行为我们可知,在   fn2 函数执行的时候,其实 fn1 上下文已经出栈了,按照 javascript 的垃圾回收机制,fn1   上下文的变量对象失去引用后会被垃圾回收机制回收,但由于在 fn2 上下文的作用域链包含了 fn1 上下文的变量对象,所以 fn1   上下文的变量对象不会被垃圾回收机制回收。

  我在之前的文章说过,函数作用域是在函数被定义(声明)的时候确定的。每一个函数都会包含一个   [[scope]] 内部属性,在函数被定义的时候,该函数的 [[scope]] 属性会保存其上层上下文的变量对象,形成包含上层上下文变量对象的层级链。

  从代码中可知,在   fn2 函数被定义的时候,其上层上下文包括了 fn1 上下文和全局上下文

  

  当 fn2   被调用的时候,其执行上下文被创建并入栈,此时会生成变量对象并将该变量对象添加进作用域链的顶端,并且将 [[scope]] 添加进作用域链

      

  可见,fn2   上下文的作用域链中包含了 fn1 上下文的变量对象,并且由于 fn2 访问了 fn1 中的变量,所以阻止了 fn1   上下文的变量对象被垃圾回收机制回收。

  让我们来看一个面试题经常会遇到的一个关于闭包的很经典的题目~

      

  求出上面代码三个函数的输入结果。

  如果对前面执行上下文系列文章已经理解透彻的童鞋,应该能够很容易得出,三个函数都是输出   3 。让我们来分析一波~

  在 arr[0]   函数执行之前,我们可以知道,全局上下文的变量对象如下所示

   

  在 arr[0]   被调用执行时,其作用域链在函数上下文的创建阶段被创建,其作用域链如下

 
   
                   

本文由职坐标整理并发布,希望对同学们有所帮助。了解更多详情请关注职坐标软件测试之测试技术频道!


本文由 @白羽 发布于职坐标。未经许可,禁止转载。
喜欢 | 0 不喜欢 | 0
看完这篇文章有何感觉?已经有0人表态,0%的人喜欢 快给朋友分享吧~
评论(0)
后参与评论

您输入的评论内容中包含违禁敏感词

我知道了

助您圆梦职场 匹配合适岗位
验证码手机号,获得海同独家IT培训资料
选择就业方向:
人工智能物联网
大数据开发/分析
人工智能Python
Java全栈开发
WEB前端+H5

请输入正确的手机号码

请输入正确的验证码

获取验证码

您今天的短信下发次数太多了,明天再试试吧!

提交

我们会在第一时间安排职业规划师联系您!

您也可以联系我们的职业规划师咨询:

小职老师的微信号:z_zhizuobiao
小职老师的微信号:z_zhizuobiao

版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
 沪公网安备 31011502005948号    

©2015 www.zhizuobiao.com All Rights Reserved

208小时内训课程