什么是闭包，如何解决闭包的内存泄漏

什么是闭包？

能够访问其他函数内部变量的函数

闭包解决了什么问题
由于变量的作用域的原因-----（函数内部能读取全局变量，函数外部无法读取函数内部的变量【局部变量】），为了在函数外部读取局部变量，所以就有了闭包。

闭包的作用
1.访问其他函数内部变量
2.保护变量不被内存回收机制回收
3.避免全局变量被污染 方便调用上下文的局部变量 加强封装性

闭包的缺点
闭包长期占用内存，内存消耗很大，可能导致内存泄露

## 闭包示例代码如下：

补充：注意事项，如若操作不当，可能会导致内存泄漏。

什么是内存泄漏
首先，需要了解浏览器自身的内存回收机制。
每个浏览器会有自己的一套回收机制，当分配出去的内存不使用的时候便会回收；内存泄露的根本原因就是你的代码中分配了一些‘顽固的’内存，浏览器无法进行回收，如果这些’顽固的’内存还在一直不停地分配就会导致后面所用内存不足，造成泄露。

闭包造成内存泄漏
因为闭包就是能够访问外部函数变量的一个函数，而函数是必须保存在内存中的对象，所以位于函数执行上下文中的所有变量也需要保存在内存中，这样就不会被回收，如果一旦循环引用或创建闭包，就会占据大量内存，可能会引起内存泄漏）

如何避免闭包引起的内存泄漏
1，在退出函数之前，将不使用的局部变量全部删除。可以使变量赋值为null;（示例如下）

2,避免变量的循环赋值和引用。 （示例如上）

3，利用Jquery释放自身指定的所有事件处理程序。
由于jQuery考虑到了内存泄漏的潜在危害，所以*它会手动释放自己指定的所有事件处理程序 *。只要坚持使用jQuery的事件绑定方法，就可以一定程度上避免这种特定的常见原因导致的内存泄漏。

当指定单击事件处理程序时，就创建了一个在其封闭的环境中包含button变量的闭包。而且，现在的button也包含一个指向闭包（onclick属性自身）的引用。这样，就导致了在IE中即使离开当前页面也不会释放这个循环。

闭包应用场景：

<button id="blue">blue</button>
<button id="red">red</button>
<button id="green">green</button>

<script type="text/javascript">
function changeSize(color){
		return function(){
			document.body.style.background = color
		}
	}
	
	var blue = changeSize('blue')
	var red = changeSize('red')
	var green = changeSize('green')
	
	document.getElementById('blue').onclick = blue
	document.getElementById('red').onclick = red
	document.getElementById('green').onclick = green
	
</script>

其实仅避开闭包使用而言，实现的方式有多种

<button id="blue" data-id="blue">blue</button>
<button id="red" data-id="red">red</button>
<button id="green" data-id="green">green</button>

<script src="../libs/jquery/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
	$("button").click(function(e){
		let currentButton = $(e.target).data("id");
		
		if(currentButton == "blue"){
			$("body").css({"background":"blue"})
		}else if(currentButton == "red"){
			$("body").css({"background":"red"})
		}else{
			$("body").css({"background":"green"})
		}
	})
	</script>