JS一个经典闭包问题

2021-05-17 07:28

阅读：484

YPE html>

标签：style element 就会 out 函数点击 meta 也有变量声明

这里是记录一些本人在学习过程中觉得重要的知识点，记录下来以供日后查看，如有不对欢迎指正，望在前端的路上共勉！

 1 
 2 
 3
 4     
 5     Document
 6 
 7 
 8     
 9     10     11     12 
13 
14              // 获取页面所有的input
16         var aBtn = document.getElementsByTagName(‘input‘);
17 
18         // 循环绑定点击事件,当然毫无疑问这里点击之后会弹出3，
19         //因为我们知道js是单线程的，当基本逻辑语句执行完之后，才会执行点击事件
20         //而当你触发点击事件的时候，for循环都已经跑完了，所以i已经变成了3；
21         for(var i = 0; i ){
22             aBtn[i].onclick = function(){ 
23                 alert(i);
24             }
25         }
26 
27         // 解决方法1:也是最简单的方法，就是将for循环的var变成let
28         //这样当点击每个按钮的时候，就会依次弹出0,1,2；
29         //let是ES6新增的一个变量声明方式，拥有块级作用域；
30         for(let i = 0; i ){
31             aBtn[i].onclick = function(){ 
32                 alert(i);
33             }
34         }
35 
36         //解决方法2：利用闭包(说是闭包，貌似也不完全是)，也就是函数作用域访问原则的特性
37         //函数内部可以访问外部的变量，外部却访问不了里边的；
38         for(var i = 0; i ){
39             (function(i){
40                 aBtn[i].onclick = function(){ 
41                     alert(i);
42                 }
43             })(i);
44         }
45     
46 
47

当然，这里也不仅仅局限于点击事件，也可以换成setTimeout等也有相同的问题，可以用这两种方法来解决；

JS一个经典闭包问题

标签：style element 就会 out 函数点击 meta 也有变量声明

原文地址：http://www.cnblogs.com/bsblogs/p/7745514.html

上一篇：JS里DOM的实际操作

下一篇：JS获取系统当前时间

文章来自：搜素材网的编程语言模块，转载请注明文章出处。
文章标题：JS一个经典闭包问题
文章链接：http://soscw.com/index.php/essay/86615.html

亲，登录后才可以留言！

JS一个经典闭包问题

评论

热门文章

推荐文章

最新文章

置顶文章