在window.onresize中调用一个函数。 （范围）

Question

我有一个构造函数对象。在这个构造函数中，我有两个函数。一个叫做 window.onresize ，另一个是 onBrowserResize 。现在我想在 window.onresize 函数中调用 onBrowserResize 。我该怎么做？

function MyObject() {
    window.onresize = function(event) {
        this.onBrowserResize();
    }

    this.onBrowserResize = function() {
    }
}

我希望将该功能设为公开，以便我可以这样称呼它：object.onBrowserResize();

如果我将这个函数设为私有：var onBrowserResize = function()那么我就无法在范围之外访问它。

任何人都知道该怎么做？我可能对对象的范围有点困惑。

Answer 1

//Constructor Object
function MyObject(){

};

MyObject.prototype.onWindowResize = function(){
  this.onBrowserResize();
}

MyObject.prototype.onBrowserResize = function(){

}

   //Implementation
   var myObject = new MyObject();
   myObject.onWindowResize();
   myObject.onBrowserResize();

Answer 2

在JavaScript中，this的值取决于函数的调用方式。有关详细信息，请参阅the MDN article on this。

您的问题缺少一些细节。我的回答是假设你有类似的东西：

var MyObj = function() {
    window.onresize = function(event) {
        this.onBrowserResize();
    }

    this.onBrowserResize = function() {}
}

这样的实例：

var myObj = new MyObj();

以下是实现这一目标的一些方法。

<强> 1。只需传递this.onBrowserResize 作为事件处理程序（最简单的方法，如果你的所有onresize处理程序都是调用onBrowserResize）：

var MyObj = function() {
    window.onresize = this.onBrowserResize;
    this.onBrowserResize = function() {
        // caution: "this" here won't be your object.
        // use option 3 below if you need this to be your object
    }
}

<强> 2。缓存对本地this 的引用：

var MyObj = function() {
    var that = this;
    window.onresize = function(event) {
        that.onBrowserResize();
    }

    this.onBrowserResize = function() {}
}

第3。使用Function.prototype.bind ：

修复this的值

var MyObj = function() {
    window.onresize = this.onBrowserResize.bind(this);

    this.onBrowserResize = function() {}
}