Can#39;t use #39;this#39; inside setInterval(不能在setInterval中使用这个)

本文介绍了不能在setInterval中使用这个的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

似乎不能在setInerval函数内使用this。为什么会这样呢？什么是优雅的解决方案？

<html>
<script>
var something = function(tMessage){
    this.message = tMessage;
};

something.prototype = {
    start : function(counter){
       document.getElementById('result').innerHTML += this.message + "+++<br />";
        var looper = setInterval(
            function(){
                // This is printing "undefined"
                document.getElementById('result').innerHTML += this.message + "<br />";
                if(!counter--)
                    clearInterval(looper);
            },
            20
        );
    }
};


window.onload = function(){
    var e = new something("hi");
    e.start(2);
}
</script>
<body>
<div id="result"></div>
</body>
</html>

编辑

谢谢您的回答！！但有谁能解释一下发送参数、设置和额外变量之间的区别吗？有内存问题吗？

推荐答案

这里的问题是，当您的函数被调用时，this引用全局对象。要保留当前作用域，您可以关闭：

    var looper = setInterval(
        (function(scope){
            return function(){
                // This will no longer be printing "undefined"
                document.getElementById('result').innerHTML += scope.message + "<br />";
                if(!counter--)
                    clearInterval(looper);
            };
         })(this),
        20
    );

我不会挥手并试图解释闭包(我仍在完全掌握它)，而是将您引向这个极好的答案：https://stackoverflow.com/a/111200/1726343

这篇关于不能在setInterval中使用这个的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！