1

假设 jquery 包括在内：

   function FixedPoint(bgWidth) {
        this.bgWidth= bgWidth;

        this.plot();
        $(window).resize(this.plot);

    }

    FixedPoint.prototype.plot = function() {

        console.log(this.bgWidth); //This is undefined when called by resize

    }

    var pt1 = new FixedPoint(1920);

当在构造函数中调用 plot() 或初始化之后一切正常，但是当 plot() 被 resize 函数调用时，它不能再通过“this”访问实例变量。

我可以在构造函数之外调用 resize 来解决这个问题，但希望将它放在类中以保持整洁。

4

1 回答 1

6

$(window).resize(this.plot);该方法this.plot正在从window上下文中调用。所以这是预期的行为。this将指向窗口对象而不是FixedPoint. 您可以使用 Ecmascript5 function.bind显式绑定上下文。

      $(window).resize(this.plot.bind(this));

使用 jquery，您可以使用$.proxy来做同样的事情。

只是为了更深入地了解，this上下文是根据调用方法的位置设置的（绑定函数除外）。这里 this 会在resizewindow 对象的方法中被调用，这里this指的是 window。

另一种 hacky 方法是使用匿名回调函数并使用缓存的这个变量。

 function FixedPoint(bgWidth) {
     this.bgWidth = bgWidth;
     var self = this; //cache it here
     $(window).resize(function () {
         self.plot(); //invoke with self.
     });
 }
于 2013-09-25T20:07:07.413 回答