• 闭包


    <body>
        <h3>JS中的闭包陷阱</h3>
        <button>1</button>
        <button>2</button>
        <button>3</button>
        <script>
           var list = document.querySelectorAll('button');
           for(var i=0;i<list.length;i++){
               var b = list[i];
               b.onclick = function(){
                   console.log(i);
               }
           };
        </script>
     </body>

    打印结果都是3

    原因:变量i就1个,并且这段代码不仅是对外公开了一个变量i,还公开了三个不同的监听函数,分别绑定给不同的按钮。

    修改成:

    方法一

    <script>
        var list = document.querySelectorAll('button');
        for (var i = 0; i < list.length; i++) {
            var b = list[i];
            (function (i) {
                b.onclick = function () {
                    alert(i);
                }
            })(i)
        };
    </script>
    

      

     //方法二:匿名函数变成有名函数
    for(var i=0;i<list.length;i++){
         var b = list[i];
         b.onclick = (function(num){//外部函数--此处传递形参num,注意不能再取i为变量名,否则又会重复
            return function(){//内部函数
            console.log(num);
                }
         })(i);//闭包上下文变量i,实参
    }
    

      

      

  • 相关阅读:
    leetcode 子集
    leetcode 1111. 有效括号的嵌套深度
    leetcode289 生命游戏
    关于三次握手和四次挥手,发送方和接收方处于的状态的问题。
    面试题:随意取数
    2020/3/31
    01背包和完全背包
    USACO Agri-Net 3.1
    mfc小计
    static 成员小记
  • 原文地址:https://www.cnblogs.com/dare/p/7929387.html
Copyright © 2020-2023  润新知