如何为带计算属性名的返回对象编写正确的TypeScript类型？

当然可以，通过TypeScript的泛型和模板字面量类型就能实现这个需求，让返回类型根据输入的name参数动态生成精确的键名。

方案一：使用as const快速实现 #

修改函数，通过泛型捕获name的具体字面量类型，再用as const断言保留键名的字面量类型：

function createFunctions<T extends string>(name: T) {
  return {
    [`${name}Sender`]: function Sender() {},
    [`${name}Receiver`]: function Receiver() {},
  } as const;
}

调用createFunctions('Message')时，返回类型会被精确推断为：

{
  readonly MessageSender: () => void;
  readonly MessageReceiver: () => void;
}

方案二：自定义返回类型（去掉readonly） #

如果不需要返回对象的属性是只读的，可以自定义映射类型来构建返回类型：

// 定义返回类型模板
type FunctionReturnType<T extends string> = {
  [K in `${T}Sender` | `${T}Receiver`]: () => void;
};

function createFunctions<T extends string>(name: T): FunctionReturnType<T> {
  return {
    [`${name}Sender`]: function Sender() {},
    [`${name}Receiver`]: function Receiver() {},
  } as FunctionReturnType<T>;
}

此时调用createFunctions('Message')，返回类型就是你想要的：

{
  MessageSender: () => void;
  MessageReceiver: () => void;
}

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