How to pass “this” to window setInterval

前端 未结 6 436
既然无缘
既然无缘 2020-12-06 02:40

Suppose I have a function a:

function a() {
    this.b = 1;
    this.set = setInterval(function() {console.log(this.b);}, 200);
}

So when

相关标签:
6条回答
  • 2020-12-06 02:48

    In your case, you can simply:

    function a() {
        var _this = this;
        this.b = 1;
        this.set = setInterval(function () {
          console.log(_this.b);
        }, 200);
    }
    

    Normally, we can also have a helper method Function.prototype.bind to fix the this reference.

    0 讨论(0)
  • 2020-12-06 02:49

    Just save your this reference in some other variable, that is not overridden by the window-call later on. Later you can use that variable to reference he object you started with.

    function a() {
        this.b = 1;
        var that = this;
        this.set = setInterval(function() {console.log(that.b);}, 200);
    }
    
    0 讨论(0)
  • 2020-12-06 02:50

    Since we have ES6 now, I think we need another answer here:

    Use an arrow function:

    function a() {
      this.b = 1;
      this.set = setInterval(() => {console.log(this.b);}, 200);
    }
    

    Arrow functions, opposite to normal functions, don't have a this context on their own. This means you have access to the outer this.

    0 讨论(0)
  • 2020-12-06 02:54

    Store a reference to this:

    function a() {
        var self = this;
        self.b = 1;
        self.set = setInterval(function() {console.log(self.b);}, 200);
    }
    

    The anonymous function that you pass to setInterval has access to any variables in its containing scope, i.e., any local variables of function a(). The magic of JS closures keeps these variables alive even after a() has completed, and each invocation of a() gets its own closure.

    0 讨论(0)
  • 2020-12-06 02:55

    This question is waay too old, but I did not like the solutions in here as the idea has mostly been about attaching the instance to something public.

    Here is another, working idea:

    The problem is that when calling as a callback from an interval, the scope is not inside this. However, you can kinda force it to be by defining a Function variable.

    function a() {
      var localCallback: () => {
        // access `this` as you will
        console.log(this);
      };
      this.timer = setInterval( localCallback, this.saveInterval );
    }
    

    Hope this is helpful!

    0 讨论(0)
  • 2020-12-06 03:05

    This would be the cleanest solution, since most of the time you actually want to switch the this context for your consecutive method calls:

        // store scope reference for our delegating method
        var that = this;
        setInterval(function() {
            // this would be changed here because of method scope, 
            // but we still have a reference to that
            OURMETHODNAME.call(that);
        }, 200);
    
    0 讨论(0)
提交回复
热议问题