如何让TypeScript接口方法的this自动推导对象自身只读类型？

你的问题根源在于BaseProcessor的索引签名[key: string | symbol]: unknown覆盖了对象的具体属性类型，导致TypeScript无法正确推导this.hello的类型。以下是两种可行的实现方式：

方式一：泛型直接约束完整类型 #

通过泛型T自动捕获传入对象的完整结构，显式将process方法的this绑定为Readonly<T>，同时返回只读的处理器实例：

function makeProcessor<T extends { process: (this: Readonly<T>) => void }>(definition: T): Readonly<T> {
  // 可选：冻结对象确保运行时只读
  return Object.freeze(definition) as Readonly<T>;
}

export const processor = makeProcessor({
  hello: "world!",
  count: 42,
  process() {
    console.log(this.hello); // 类型推导为string
    console.log(this.count); // 类型推导为number
    // this.hello = "new value"; // 编译报错：this属性只读
  }
});

这种方式的核心是让泛型自动推导传入对象的所有属性，无需手动指定类型参数，同时通过Readonly<T>约束this的只读特性。

方式二：拆分属性与方法类型 #

如果需要明确区分处理器的自定义属性和方法，可以拆分类型定义：

type Processor<T> = Readonly<T> & {
  process(this: Readonly<T>): void;
};

function makeProcessor<T extends Record<string | symbol, unknown>>(
  definition: T & { process: (this: Readonly<T>) => void }
): Processor<T> {
  return Object.freeze(definition) as Processor<T>;
}

export const processor = makeProcessor({
  hello: "world!",
  flag: true,
  process() {
    console.log(this.hello); // string类型
    console.log(this.flag); // boolean类型
  }
});

这里T专门指代自定义属性集合，Processor<T>将属性设为只读并绑定process的this类型，结构更清晰。

关键注意点 #

• 移除原代码中的索引签名，避免覆盖具体属性的类型推导。
• 利用泛型自动捕获对象结构，无需手动指定类型参数。
• Readonly<T>会在编译阶段阻止对this属性的修改，同时保证类型推导准确。

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