Question

我可以使用setInterval来重复调用一个函数。

function foo(){
    setTimeout(foo, 1000);
}();

问题是，我想在object中做同样的事情，这里是代码段。

var evt;
var init;

evt = function() {
    return {
        cycle:function(str) {
            setTimeout(function(str) {
                this.cycle(str);
            }, 1000);
        }
    }
}

init = new evt();
init.cycle("Hallo word");

然后显示错误消息

this.cycle（）不是函数。

我试图在代码的上面一行将变量this设置为{

var evt;
var init;

evt = function() {
    var parent;

    parent = this;
    return {
        cycle:function(str) {
            setTimeout(function(str) {
                parent.cycle(str);
            }, 1000);
        }
    }
}

init = new evt();
init.cycle("Hallo word");

但仍然得到。

parent.cycle（）不是函数

有没有办法做到这一点，我要在第一次尝试显示evt.cycle("Hello World")后打电话给Hello World，它将在接下来的几秒钟内重复显示Hello World。

我需要将函数保留在该函数生成的对象内。感谢您的任何纠正。

Answer 1

返回新对象时，将定义新范围。因此，您应该将此指针绑定到函数。或者，您可以通过以下方式使用.bind（this）函数：

setTimeout((function(str){ 
}).bind(this), 1000)

有关更多信息：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

或者您可以使用致电或申请：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply

在es6中，当this指针被继承时，可以使用（）=> {}（箭头）函数。

其他工作解决方案：

var evt;
var init;

evt = function() {
    var parent;

    parent = this;
    return {
        cycle:function(str) {
            var me = this;
            setTimeout(function(str) {
                console.log("cycle");
                me.cycle(str);
            }, 1000);
        }
    }
}

init = new evt();
init.cycle("Hallo word");

Answer 2

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this

const evt = function() {
  return {
    i: 0,
    cycle: function(str) {
      const _this = this;
      setTimeout(() => {
        console.log(str.substring(0, this.i));
        _this.cycle(str, ++this.i);
      }, 1000);
    }
  }
}

init = new evt();
init.cycle("Hello world");

我稍微扩展了该示例以进一步说明this的效果。

Javascript函数自我调用内部对象

2 个答案: