欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

JS中for循环闭包问题如何解决

程序员文章站 2022-03-25 09:26:01
...
本文我们将和大家分享两种JS中for循环闭包问题如何解决的方法,希望能帮助到大家。

JS中for循环闭包问题如何解决

像这样一个代码片段,初学者会理所当然地认为依次点击Li会弹出相应的0、1、2、3、4、5,但实际结果却是这样的

JS中for循环闭包问题如何解决

我们无论点哪个按钮,最后弹出来的都是6。这就是经典的for循环闭包问题。

那么,首先让我们来了解一下什么是闭包,百度百科是这样解释的:闭包是可以包含*(未绑定到特定对象)变量的代码块;这些变量不是在这个代码块内或者任何全局上下文中定义的,而是在定义代码块的环境中定义(局部变量)。“闭包” 一词来源于以下两者的结合:要执行的代码块(由于*变量被包含在代码块中,这些*变量以及它们引用的对象没有被释放)和为*变量提供绑定的计算环境(作用域)。在 Scala、Scheme、Common Lisp、Smalltalk、Groovy、JavaScript、Ruby、 Python、Lua、objective c 以及Java(Java8及以上)等语言中都能找到对闭包不同程度的支持。

而我的简单理解就是:一个函数中嵌套了另一个函数,里面的一个函数要访问外层函数的变量,所以就形成了一个闭包,闭包即是为了保留某些局部变量的值而存在的。

然而javascript 有些常见的闭包问题,比如上面的例子,那么我们来看看怎么解决这些问题。

解决方案一:加一层闭包,i 以函数参数形式传递给内层函数:

JS中for循环闭包问题如何解决

结果就是点击相应的li会弹出相应的数字,比如点第三个li,会出现以下效果:

JS中for循环闭包问题如何解决

解决方案二:找个属性将i值保存起来,然后弹出这个值

JS中for循环闭包问题如何解决

点第三个li,会出现以下效果:

JS中for循环闭包问题如何解决

相关推荐:

JavaScript for循环if判断语句详解

for-in循环和for循环遍历数组的用法

javascript中for循环使用时的注意事项

以上就是JS中for循环闭包问题如何解决的详细内容,更多请关注其它相关文章!