深入理解JavaScript中闭包的概念!

390 阅读2分钟

一、闭包的概念

  • 定义: 当通过调用外部函数A返回的内部函数后,即使外部函数已经执行结束了,但是内部函数引用了外部函数的变量依然会保存在内存中,我们把这些变量的集合称为闭包

二、如何实现闭包

在开始聊闭包之前,我们先了解一个概念——调用栈。 调用栈是用来管理函数调用关系的一种数据结构,当一个函数执行完毕后,该函数的执行上下文就会被销毁(出栈)

我们来举一个例子:

var a=2 
function add(){ 
var b=10 
return a+b } 
add()

首先第一步,全局的代码进行预编译,然后会创建一个全局执行上下文对象GO,进栈。

第二步,全局的代码执行,a的值被赋值为2,加下来进行add函数调用。

第三步,add函数的调用带来add函数的预编译,会创建一个add函数的执行上下文对象AO,进栈。

第四步,add函数执行,b赋值为10,返回a+b。

让我们用画图的方式更生动描绘这个例子:

1.1.png 1.2.png

1.3.png 1.4.png

执行完毕后,该函数的执行上下文对象就会被销毁,紧接着,全局执行上下文对象也会出栈。

接下来举一个例子展现闭包的形成:

function a()
{ 
function b(){ 
var bb=234 
console.log(aa);
} 
var aa=123 
return b 
} 
var demo=a() 
demo()

这里的打印结果是:123,因为在这里形成了闭包!
闭包的形成就是当函数a将内部函数b返回出来调用的时候

三、闭包的缺点

一旦形成闭包,只有在页面关闭后闭包占用的内存才会被回收,所以造成了内存泄漏

闭包的作用

  1. 模块化开发(实现公有变量)
  2. 做缓存
  3. 封装私有化属性
  4. 防止全局变量污染