TypeScript错误：联合类型的索引签名——初学者解决方案

引言：为什么TypeScript会报错你的代码？

你是否曾经写过一段看起来完全合乎逻辑的TypeScript代码，但编译器却突然抛出一个令人恐慌的错误？如果你遇到过这样的消息：“An index signature parameter type cannot be a union type. Consider using a mapped object type instead”——你并不孤单。这个错误是Stack Overflow上最热门的问题之一（数千次浏览！），而且它常常让经验丰富的开发者都感到困惑。

在本文中，我们不仅会展示如何修复这个错误。我们还会深入分析为什么TypeScript如此严格，以及如何使用映射对象类型，让你的代码不仅能够运行，而且更加安全。开始吧！

什么是索引签名，它有什么用？

想象一下，你正在创建一个对象，它的键是字符串，值是数字。例如，一个商品价格字典：

// 普通对象\nconst prices = {\n  apple: 100,\n  banana: 50,\n  cherry: 200\n};

但是，如果你想告诉TypeScript：“听着，这个对象可以有任何字符串键，并且所有值都是数字”，该怎么办？这时就需要索引签名——一种特殊的语法，用于描述对象所有属性的模式：

// 索引签名：[key: string]: number\ninterface PriceMap {\n  [key: string]: number;\n}\n\nconst prices: PriceMap = {\n  apple: 100,\n  banana: 50\n};

这里的[key: string]: number就是索引签名。它表示：“键是字符串，值是数字”。很简单，对吧？

那么联合类型有什么问题？

现在，想象一下你想将可能的键限制为只有两个选项：'name'或'age'。看起来合乎逻辑的写法是：

// ❌ 错误！不能这样写\ninterface Person {\n  [key: 'name' | 'age']: string | number;\n}

这时TypeScript就会抛出那个熟悉的错误：“An index signature parameter type cannot be a union type. Consider using a mapped object type instead”。

为什么？因为索引签名用于描述不受限制的键集合。如果你想指定一个具体的键列表，那就不再是模式，而是对结构的精确描述。TypeScript不允许混淆这两个概念。

如何修复这个错误？使用映射对象类型

编译器本身建议的解决方案是使用映射对象类型。听起来很复杂，但实际上它只是一种“遍历”联合类型中的所有键，并为每个键创建对应属性的方法。

具体写法如下：

// ✅ 正确：使用映射类型\ntype Person = {\n  [K in 'name' | 'age']: K extends 'name' ? string : number;\n};\n\n// 或者更简单的版本，如果值类型相同：\ntype PersonSimple = {\n  [K in 'name' | 'age']: string | number;\n};

我们来解析一下语法[K in 'name' | 'age']：

\n
• K——是一个变量，它会依次取联合类型中的每个值（先是'name'，然后是'age'）。
\n
• in——关键字，用于启动对类型的“循环”。
\n
• 'name' | 'age'——我们的键集合。
\n

结果，TypeScript会创建一个具有两个具体属性的对象：name和age。错误消失了！

不同值类型的示例

通常，不同的键需要有不同的值类型。使用条件类型可以优雅地解决这个问题：

type Config = {\n  [K in 'host' | 'port' | 'debug']: \n    K extends 'host' ? string :\n    K extends 'port' ? number :\n    boolean;\n};\n\n// 现在：