如何在类中从自身调用方法？

Question

我目前正在实现一个 WebSocket。因为我想在连接关闭时重新连接，所以我实现了一个connect()函数并尝试在 close 事件中从它本身调用它，但不幸的是它不起作用：

class WebSocket {

    constructor( options = {} ) {

        this.url = "ws://localhost:8181";

        this.connect();

    }

    connect() {

        let ws = new WebSocket( this.url );

        ws.onclose = function ( event ) {

            console.log( `WebSocket connection to ${ this.url } failed: ${ event.reason }` );

            setTimeout( function () {

                connect();

            }, 5000 );

        };

    }

} 

抛出的错误是：

Uncaught ReferenceError: connect is not defined

我从来没有在 JavaScript 中使用过类，所以我有点困惑。也许有人可以给我一个提示？

Answer 1

存在三个问题：要引用对象的属性，请使用.，例如obj.prop。在这里，您要在其上引用属性的对象是实例，this。您需要确保this引用内部的类实例setTimeout，因此使用箭头函数WebSocket类名与词法范围属性冲突globalThis.Websocket- 将您的类命名为其他名称：class Connector {  constructor(options = {}) {    this.url = "ws://localhost:8181";    this.connect();  }  connect() {    const ws = new WebSocket(this.url);    ws.onclose = (event) => {      console.log(`WebSocket connection to ${ this.url } failed: ${ event.reason }`);      setTimeout(() => {        this.connect();      }, 5000);    };  }}

Answer 2

我找到了解决方案。因为this引用ws.onclose，我需要在我的函数顶部立即保护它：class Connector {    constructor(options = {}) {        this.url = "ws://localhost:8181";        this.connect();    }    connect() {        const ws = new WebSocket(this.url),              self = this;        ws.onclose = (event) => {            console.log(`WebSocket connection to ${ this.url } failed: ${ event.reason }`);            setTimeout(() => {                self.connect();            }, 5000);        };    }}