Typescript 中对象类型定义的区别

Question

我们一直致力于一个更大的项目，不同的开发人员似乎对一个相当平面的对象使用不同的类型定义，更准确地说，有两个版本脱颖而出。 任何人都可以解释使用任一版本的主要区别、好处和含义吗？

type MyObject = { [_: string]: string | number }
type MyObjectAlternative = Record<string, string | number>

干杯

Answer 1

两种类型之间存在差异。

type MyObject = { [_: string]: string | number }
type MyObjectAlternative = Record<string, string | number>

您不能在MyObject使用联合（在 4.4 之前的 TypeScript 中）：

type MyObject = { [_: string | number ]: string | number } // error
type MyObjectAlternative = Record<'a'|'b', string | number> // ok

type MyObject = { [_: 'a'|'b' ]: string | number } // error
type MyObjectAlternative = Record<'a'|'b', string | number> // ok

索引签名参数类型不能是联合类型。 考虑使用映射对象类型代替

从 T.4.4（目前是测试版）开始，您可以使用 union 作为 MyObject 中的一种键。

type MyObject = { [_: string | number | symbol]: string | number } // allowed
type MyObjectAlternative = keyof Record<'a' | 'b', string | number> // ok

type Keys = {
    [Prop in keyof MyObject]: Prop
}

type Keys2 = {
    [Prop in keyof MyObjectAlternative]: Prop
}

您可能已经注意到， keyof MyObject和keyof MyObjectAlternative运算符在这两种情况下的工作方式不同。

MyObjectAlternative更像 JavaScript 中的常规对象，具有所有内置属性，而MyObject被视为没有原型的对象。

此外，从 TS 4.4 开始，我们可以混合模板文字字符串：

type MyObject = { [_:  `data-${string}`]: string | number } // ok

但请记住

type MyObject = { [_:  'a'|'b']: string | number } // error

仍然不允许文字联合

打字稿 4.4

Answer 2

Record与类型文字相同。 如果您查看Record的定义，您将看到：

/**
 * Construct a type with a set of properties K of type T
 */
type Record<K extends keyof any, T> = {
    [P in K]: T;
};