TypeScript中含toString方法的函数无法作为对象键的解决方法

这个问题我之前也碰到过！TS的类型检查确实比JS严格不少——虽然JS里会自动调用函数的toString()方法把它转成字符串当对象键，但TS不认这种隐式转换，得我们显式告诉它我们的意图才行。下面给你两种实用的解决方式：

方法一：临时类型断言（简单直接） #

直接用as unknown as string把函数类型断言成字符串类型，这样TS就会放行，而运行时JS依然会自动调用你定义的toString()方法，完全保留原来的行为，又不用手动写action.toString()：

const type: string = 'SOME_TYPE';
const action = <T>(payload: T) => ({ type, payload });
action.toString = () => type;

const map = {
  [action as unknown as string]: '...' // 类型断言解决报错
};

方法二：定义专属类型（规范优雅） #

如果这个函数需要多次当作键使用，可以定义一个包含toString()方法的类型，让TS明确知道这个函数可以被转换为字符串：

// 定义一个既有函数特性，又能返回字符串的类型
type StringableFunction = Function & { toString(): string };

const type: string = 'SOME_TYPE';
// 把函数断言为我们定义的类型
const action = (<T>(payload: T) => ({ type, payload })) as StringableFunction;
action.toString = () => type;

const map = {
  [action]: '...' // TS不再报错，类型更清晰
};

为什么TS会报错？ #

TS默认要求对象的键只能是string、number或symbol类型，虽然你的函数有自定义的toString()，但TS不会自动推断“这个函数可以被隐式转换为字符串”，所以必须我们显式声明类型转换的意图，既满足TS的类型安全要求，又保留JS的运行时行为。

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