TypeScript类中回调绑定this后调用私有方法报错咨询

看起来你遇到的核心问题是this的上下文丢失，这里有两个容易踩的坑，咱们一步步拆解：

为什么你的代码会出错？ #

首先，ES6箭头函数的特性是在定义时就捕获外层作用域的this，而非普通函数那样在运行时确定this。你原本的代码里已经用箭头函数包裹了success回调，它本应正确捕获dispatch方法执行时的this——但你额外调用的.bind(this)不仅多此一举，甚至可能干扰箭头函数的this绑定逻辑。更关键的是，你说console.log(this)输出的是Window对象，这说明**dispatch方法本身执行时的this就不是类实例**，所以箭头函数捕获到的自然也是Window。

两个关键修复步骤 #

1. 移除箭头函数后的.bind(this) #

箭头函数不需要手动绑定this，它已经自动捕获了外层上下文。先把这部分改对：

protected dispatch(ajaxParams: JQuery.AjaxSettings<any>): void {
    ajaxParams.success = (a: any, b: any) => {
        console.log(this) // 若dispatch的this正确，这里会输出类实例
        this.receiveCheck(0)
    };
    $.ajax(ajaxParams);
}

2. 确保dispatch方法的this指向类实例 #

如果移除bind后问题依然存在，大概率是你调用dispatch的方式导致它的this丢失了——比如把dispatch作为回调传给事件、其他函数时，没有绑定正确的this。这时候有两种常见解决方式：

方式一：在构造函数中绑定dispatch的this

class YourClass {
    constructor() {
        // 绑定后，无论怎么调用dispatch，this都会指向类实例
        this.dispatch = this.dispatch.bind(this);
    }

    private receiveCheck(num: number): void {
        // 你的私有方法逻辑
    }

    protected dispatch(ajaxParams: JQuery.AjaxSettings<any>): void {
        ajaxParams.success = (a: any, b: any) => {
            console.log(this)
            this.receiveCheck(0)
        };
        $.ajax(ajaxParams);
    }
}

方式二：用箭头函数定义dispatch方法

这种方式会让dispatch的this永久绑定到类实例，无需手动在构造函数中绑定：

class YourClass {
    private receiveCheck(num: number): void {
        // 你的私有方法逻辑
    }

    protected dispatch = (ajaxParams: JQuery.AjaxSettings<any>): void => {
        ajaxParams.success = (a: any, b: any) => {
            console.log(this)
            this.receiveCheck(0)
        };
        $.ajax(ajaxParams);
    }
}

验证方法 #

修改后可以先在dispatch方法开头加一句console.log(this)，如果输出的是你的类实例，那success回调里的this肯定也能正确指向实例，调用receiveCheck就不会报错了。

内容的提问来源于stack exchange，提问作者Vilda