3.JavaScript中的闭包

JavaScript中的闭包

概念

闭包是函数的一种高级应用方式；
通过建立一个不被销毁的存储空间，来在函数的外部调用和使用函数内部的数据

定义闭包的三个条件

三个条件缺一不可

1.定义个函数a，返回值是函数b
2.在返回值函数b中，使用函数a定义的局部作用域变量
3.在函数a的外部，引用函数a，并且执行返回函数b

闭包举例代码

function funA(){
		let a=1;
		let b=2;
		let c=3;
		return function funB(){
			return a+b+c;
		}
	}
	let a1=funA();
	console.log(a1);
	let a2=a1();
	console.log(a2);

运行结果

**
在函数b中引用函数a中定义的局部作用域变量，
在函数a外部，调用函数a
此时a1中存储的是函数b的内存地址，如答案的上部分所示，
调用a1，实际上通过a1存储地址来调用函数b，如答案的下部分所示
最终目的是，通过函数b的返回值，来在函数a的外部，
调用函数a的局部作用域变量
**

闭包的特点——既是优点也是缺点

	1.函数作用域空间不会被销毁
	优点：空间中的内存永远存在
	缺点：占用大量的内存空间
	2.可以从外部访问函数内部的变量
	优点：使用变量数据方便
	缺点：容易泄露数据
	3.保护私有作用域变量
	优点：不会污染全局变量
	缺点：占用内存空间

闭包存在的问题

**
闭包最大的问题是，有可能造成占用大量的内存空间，
降低程序的执行效率，甚至有可能造成数据溢出或者是数据泄露，
因为为了保护数据的安全性，特殊情况下才会使用闭包
**

闭包的应用——实现点击效果

在列表中有四个li，点击对应的li ，在控制台输出当前li是第几个li

<ul>
	<li>我是第一个li</li>
	<li>我是第二个li</li>
	<li>我是第三个li</li>
	<li>我是第四个li</li>
	<li>我是第五个li</li>
</ul>

页面显示

let oli=document.querySelectorAll('li');
	for(var i=0;i<oli.length;i++){
		oli[i].addEventListener('click',(function(int){
			return function(){
				console.log(int+1);
			}
		})(i))
	}

结果，显示相对应的第几个li