如何在编译时捕获TypeScript中遗漏.bind的情况？

你遇到的是类方法作为回调传递时this丢失的典型问题——TypeScript默认不会主动检查这类场景，但确实可以通过TypeScript本身的类型特性，或者typescript-eslint规则在编译/代码检查阶段提前拦截错误。

一、用TypeScript的this类型标注强制检查 #

给类方法显式声明this参数的类型，让TypeScript强制验证调用时的this上下文是否匹配类实例。

修改你的Y类：

class Y {
    constructor(private readonly extra: number) {}
    // 显式标注this必须是Y的实例
    add(this: Y, n: number) { return n + this.extra }
}

这时再直接传递y.add给map，TypeScript会直接抛出编译错误：

The 'this' context of type '(this: Y, n: number) => number' is not assignable to method's 'this' of type 'Y'.

因为map执行回调时不会自动绑定Y的实例作为this，TypeScript能精准识别到这个不匹配，从根源阻止错误代码进入运行阶段。

二、用typescript-eslint规则自动检测 #

启用@typescript-eslint/unbound-method规则，它专门负责检查类方法是否被当作未绑定的函数引用传递。

配置方法： #

1. 先确保安装了typescript-eslint依赖：

npm install --save-dev @typescript-eslint/eslint-plugin @typescript-eslint/parser

2. 在.eslintrc（或.eslintrc.json）中添加规则配置：

{
  "parser": "@typescript-eslint/parser",
  "plugins": ["@typescript-eslint"],
  "rules": {
    "@typescript-eslint/unbound-method": "error"
  }
}

开启后，只要你直接传递未绑定的类方法（比如[1,2,3].map(y.add)），ESLint就会立刻报错，提示你要么用bind绑定this，要么改用箭头函数包裹（n => y.add(n)）。

补充：箭头函数类成员的偷懒方案 #

如果不想每次都手动绑定this，可以把类方法定义成箭头函数，这样this会自动绑定到类实例：

class Y {
    constructor(private readonly extra: number) {}
    add = (n: number) => n + this.extra
}

这种写法下，y.add本身就携带了正确的this上下文，传递给任何回调都不会出错。但要注意：箭头函数类成员会让每个实例都创建一个新的函数副本，会增加一点内存开销，适合小型类或者高频使用的场景。

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