JavaScript循环中设置onClick参数问题

2017-05-23  本文已影响0人  中華田園雞

首先看一段代码:

```

代码块

···

然后运行一下,当时作为一名天真的js初学者理所当然的认为分别点击不同的额按钮,会分别的打印出0、1、2、3、4,然而事与愿为,现实和理想总是存在差距,点击不同的按钮,打印却都是5,百思不得其解,不科学啊!

最后百度了一番才恍然大悟,原来console.log(i)里的i在循环完成的时候被赋值成了5,而每个按钮的onclick都被赋值了同一个function,也就是说每个function里的i指的是同一个i,i=5,自然每个点击都会打印出5,那么该怎么解决呢?!

再看接下来这段代码:

再运行这段代码,就可以得到你想要的效果,但是是为什么呢?

知道了原因就好办了,利用闭包把每个function里的i都变成不同的i就行了,当时作为一名初学者还不懂闭包,也是后来才理解的。

循环中的function自调用,将循环中的i作为参数传入function中,此时,function中的i已经不是循环中的i了(这里有点绕,其实形参i,即function里的i换成什么变量名都行),而是在内存中开辟了一个内存空间存储了作为参数传进来的i的值,这样function中的就不会随着循环中的i的值的改变而改变了,就可以打印出你要的结果了。

上一篇下一篇

猜你喜欢

热点阅读