关于javascript:javascript-中的-this-集合

36次阅读

共计 694 个字符，预计需要花费 2 分钟才能阅读完成。

不论以后应用的 this 指向谁，在应用 setTimeout 或者 setInterval 中的 this 都会指向最外层对象，也就是 window，而应用箭头函数就能够让 this 持续指向上一层对象而不是最外层。

<body>
    <buttn id='demo'> 发送验证码 </button>
</body>
 
<script type="text/javascript">
    // jquery
    // 从新发送验证码倒计时
    $("#demo").click(functuin() {
        // 给 demo 按钮增加 disabled 禁用属性，this 指向 button 标签对象
        $(this).addClass('disabled');
        var time = 30;
        // 想要在 click 中应用 setTimeout, 一般写法 setTimeout(function(){}, 1000)，会让 this 指向 window，导致不能应用 $(this) 去间接操作 button
        // 能够应用 _this = this 先把 button 对象拿进去，更简略的办法是应用箭头函数 (=>)
        var interval= setInterval(() => {if(condition){
                // 去除定时器
                clearInterval(interval);
                $(this).removeClass('disabled');
                $(this).attr('disabled', false);
                $(this).test("从新发送");
                return;
            }
            time--;
            $(this).text('从新发送 (' + time + 's)');
        }, 1000)
            
    })
 
</script>

正文完