深入理解JavaScript闭包

原创已于 2022-04-12 20:15:32 修改 · 598 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

于 2021-02-09 18:55:31 首次发布

JavaScript 专栏收录该内容

33 篇文章

订阅专栏

本文详细解释了闭包的概念及其实现原理，并通过实例展示了闭包如何用于实现公有变量、缓存、封装以及模块化开发等场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、什么是闭包

多个（两个或两个以上）函数嵌套，当内部函数被保存到外部时，将会生成闭包。内部函数在外面执行的时候一定能够调用的了原来它在的那个函数环境里的变量。闭包会导致原有作用域链不释放，造成内存泄露。

function a(){
	function b(){
	    var bbb = 234;
	    console.log(aaa);
	 }
	 var aaa = 123;
	 return b;
}
var glob = 100;
var demo = a();
demo();

示例解析：

在这里插入图片描述
1、a 被执行时，a的作用域链存放了a的执行上下文，放在了作用域的最顶端

2、a被执行的时候，b被定义，然后b的作用域链上就会存放a的执行上下文，放在自己作用域链上的最顶端，再往下执行 b被return抛到全局被demo变量保存。

3、当a被执行之后，a的作用域上存放的a的执行上下文被销毁，a回归被定义状态，等待执行。但由于之前b的作用域链上存放了a的执行上下文，所以b的作用域链上存放的a的执行上下文没有被销毁。

二、闭包的作用

1、实现公有变量

function add(){
	var count =0;
	function demo(){
		count ++;
		console.log(count);
	}
	return demo;
}
var counter= add();
counter();//1
counter();//2

2、可以做缓存（存储结构）

function eater(){
	var food ="";
	var obj ={
		eatFood:function(){
			if(food!=""){
				console.log("i am eating"+food);
				food ="";
			}else{
				console.log("There is nothing!");
			}
		}
		pushFood:function(myFood){
			food = myFood；
		}
	}
	return obj;
}
var eater1 = earer();
eater1.pushFood('banana');
eater1.eatFood();