简单说下闭包在事件回调中的用法

最新推荐文章于 2022-10-26 19:07:07 发布

weixin_33989058

最新推荐文章于 2022-10-26 19:07:07 发布

阅读量185

点赞数

文章标签： python

原文链接：https://my.oschina.net/codingBingo/blog/760946

版权

2019独角兽企业重金招聘Python工程师标准>>>

说到闭包,想必这是很多童鞋在面试或者是学习的时候经常遇到的问题,

那么我们先说闭包的含义,下面这句话是我在wiki上面找到的

在计算机科学中，闭包（英语：Closure），又称词法闭包（Lexical Closure）或函数闭包（function closures），是引用了自由变量的函数。这个被引用的自由变量将和这个函数一同存在，即使已经离开了创造它的环境也不例外。所以，有另一种说法认为闭包是由函数和与其相关的引用环境组合而成的实体。闭包在运行时可以有多个实例，不同的引用环境和相同的函数组合可以产生不同的实例。

可能上面的语言说的太生涩了,那我就来简单的解释一下,

所谓闭包,其实就是主函数返回的一个子函数,子函数的"生存环境"依赖于主函数中的一些变量,而形成的一个类似于"包"的函数,

可能我说的也比较难理解,那么下面来看这张图

c的"生存环境"是依赖于a的,同理b也是,ok,关于闭包,我就介绍到这里,如果还是有童鞋不是很理解的话,

可以猛戳这里

好啦,介绍过了闭包,那么要怎么用呢?

其实吧,在鄙人的码农生活中,闭包用的最多的时候,就是用来解决异步的时候,

好啦,下面来举个例子,直接来看代码

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>demo</title>
</head>
<body>
	<ul>
		<li>1</li>
		<li>2</li>
		<li>3</li>
		<li>4</li>
	</ul>
</body>
</html>

这是一个最简单的序列,

现在我要做一个功能,实现分别点击这些对应的序列,弹出对应的序列号值,

ok.,我们就要这么写

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>demo</title>
</head>
<body>
	<ul>
		<li>1</li>
		<li>2</li>
		<li>3</li>
		<li>4</li>
	</ul>
</body>
<script>
	var lis = document.getElementsByTagName('li');
	for (var i = 0; i < lis.length; i++) {
		(function(i){
			lis[i].addEventListener('click',function(e){
				console.log("li",lis[i].innerText);
			},false);
		})(i)
	}
</script>
</html>

明白这里的闭包的意思了吧,就是要保护这个索引值的变量不被污染,所以用了