javascript - 如何访问 native 对象调用的函数中的实例？

Question

我承认我已经问过关于 this 关键字的问题以及它在某些情况下的含义，但恐怕我仍然没有完全理解它。任何提示将不胜感激。

我基本上有一个 Socket 类，它是 HTML5 的 WebSocket 类的包装器，使事情变得更容易(我只复制了与我的问题相关的内容):

var Socket = function(url) {
    this.url = url;
    this.webSocket = null;
}

Socket.prototype.init = function() {
    this.webSocket = new WebSocket(this.url);
    this.webSocket.onmessage = this.parseMessage;
};

Socket.prototype.parseMessage = function(event) {
    console.log(this); // logs the WebSocket (native) instance
}

在 parseMessage 函数中，this 指的是 native WebSocket 对象的实例，那么我如何才能将实例访问到我的 Socket对象在这里？

非常感谢。

Answer 1

您可以绑定(bind)它:

this.webSocket.onmessage = this.parseMessage.bind(this);

然而，并非所有浏览器都支持此功能，但您可以从 MDC 获取代码片段使所有浏览器兼容。

如果您不熟悉绑定(bind)...它可以让您具体指定调用该函数时 this 应该 是什么。在该行运行时，this 是您的 Socket 类实例，因此您基本上是在强制 this inside parseMessage 指向实例.

如果出于某种原因，您不想使用 bind，另一种选择是将 this 的副本保存到一个变量中，这样意义就不会丢失在事件调度中:

Socket.prototype.init = function() {
    this.webSocket = new WebSocket(this.url);
    var _self = this;
    this.webSocket.onmessage = function (event) {
        _self.parseMessage.apply(_self, [event]);
    };
};