javascript - 调用window.onresize中的函数。 (范围)

Question

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

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

    this.onBrowserResize = function() {
    }
}

我希望将该函数公开，这样我就可以这样调用它:object.onBrowserResize();

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

有人知道该怎么做吗？我可能只是对对象的范围有点困惑。

Answer 1

在 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() {}
}