如何在TypeScript中定义支持自定义字符串属性的数组类型或接口？

嗨，这个问题我之前也踩过坑，咱们一步步捋清楚怎么解决～

首先得说你尝试的写法为什么会报错：interface IList extends Array<number> { [key: string]: string; } 里的字符串索引签名和Array<number>本身的索引签名冲突了。因为数组的索引签名是[index: number]: number，而TypeScript要求字符串索引的类型必须能覆盖所有属性的类型（包括数组自带的number索引元素、length属性、push这类方法的类型），你定义的string类型显然兼容不了数组里的number元素和其他内置成员，所以编译器会直接报错。

接下来给你两种常用的解决方案，按需选择：

方案1：定义特定的自定义属性（推荐，类型更精确） #

如果你的自定义属性是固定的几个（比如例子里的foo），直接在接口里明确声明这些属性就行，不用写宽泛的索引签名：

// 定义接口，继承Array<number>并添加特定属性
interface NumberListWithFoo extends Array<number> {
  foo: string;
}

// 用Object.assign创建，TS能自动推断类型，不用额外断言
const list = Object.assign([1, 2, 3, 4, 5], { foo: 'bar' });

console.log(list); // 类型为NumberListWithFoo，包含数组元素和foo属性
console.log(list[1]); // 类型：number（完全符合预期）
console.log(list.foo); // 类型：string（完全符合预期）

如果一定要用数组字面量直接赋值，需要加个类型断言：

const list = [1, 2, 3, 4, 5] as NumberListWithFoo;
list.foo = 'bar';

方案2：支持任意自定义字符串属性 #

如果需要给数组加任意字符串键的属性，就得用交叉类型，让字符串索引的类型兼容数组元素类型和自定义属性的类型：

// 定义交叉类型：数组类型 + 字符串索引类型（值可以是数组元素类型或自定义类型）
type ListWithStringProps<T> = Array<T> & {
  [key: string]: T | string;
};

// 创建实例，可添加任意字符串属性
const list: ListWithStringProps<number> = Object.assign([1, 2, 3, 4, 5], {
  foo: 'bar',
  baz: 'test',
  count: 100 // 也能兼容number类型的自定义属性
});

console.log(list.foo); // 类型：number | string
// 如果需要精确类型，可以单独断言：
console.log(list.foo as string);

这里的关键是字符串索引的类型T | string要能覆盖数组本身的元素类型T，这样就不会和数组的原生索引签名冲突了。

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