面试题：TypeScript 类方法作为回调时 this 类型的处理

Question

有一个 TypeScript 类 `MyClass`，其中有一个方法 `fetchAndProcess`，该方法接受一个外部数据获取函数 `fetchExternalData`（该函数接受一个回调作为参数）。在 `fetchAndProcess` 方法内部调用 `fetchExternalData` 并传入一个回调，此回调需要正确处理 `this` 类型指向 `MyClass` 实例，并且回调要使用实例上的其他方法对获取的数据进行处理。假设 `MyClass` 有 `processData` 方法用于处理数据，请写出 `MyClass` 的完整代码以及 `fetchExternalData` 的类型定义。

Answer 1

// fetchExternalData 的类型定义
type FetchExternalData = (callback: (data: any) => void) => void;

class MyClass {
    // 假设 processData 方法接收一个参数并处理数据
    processData(data: any) {
        // 这里写具体的数据处理逻辑
        console.log('处理数据:', data);
    }

    fetchAndProcess(fetchExternalData: FetchExternalData) {
        fetchExternalData((data) => {
            // 使用箭头函数确保 this 指向 MyClass 实例
            this.processData(data);
        });
    }
}