使用推断类型（有效的键类型）作为计算接口中的属性名称答案

【问题标题】：Using a inferred type, which is a valid key type, as the name of a property in a computed interface使用推断类型（有效的键类型）作为计算接口中的属性名称
【发布时间】：2022-10-06 03:42:58
【问题描述】：

我目前有这个：

export class UnderTest<N extends string> {
  name: N;
}

export type Tester<T> =
  T extends UnderTest<infer N>
    ? { name: `${N}`, passed: true }
    : { passed: false };

let x: Tester<Object>;
let y: Tester<UnderTest<\"foo\">>;

哪个正在执行预期的操作，即创建两种不同类型的 2 个变量，其中第一种类型是 { passed: false }，第二种类型是 { name: \"foo\", passed: true }。

我想知道是否有可能改变\"通过\"包含以 N 命名的属性的情况.基本上，我希望Tester<T> 这样做。

export type Tester<T> =
  T extends UnderTest<infer N>
    ? { name: `${N}`, passed: true, `${N}`: \"Yes, baby!\" }
    : { passed: false };

这样y: Tester<UnderTest<\"foo\">> 就会有一个foo: \"Yes, baby!\" 属性。从版本 4.8.4 开始，上面的声明会触发一些错误。

esri/views/shadergraph/v6.ts:59:41 - error TS1131: Property or signature expected.

59         ? { name: `${N}`, passed: true, `${N}`: \"Yes, baby!\" }
                                       ~~~

esri/views/shadergraph/v6.ts:59:47 - error TS1005: \';\' expected.

59         ? { name: `${N}`, passed: true, `${N}`: \"Yes, baby!\" }
                                             ~

esri/views/shadergraph/v6.ts:59:62 - error TS1128: Declaration or statement expected.

59         ? { name: `${N}`, passed: true, `${N}`: \"Yes, baby!\" }
                                                            ~

esri/views/shadergraph/v6.ts:60:9 - error TS1128: Declaration or statement expected.

60         : { passed: false };
       ~

[12:35:38 PM] Found 4 errors. Watching for file changes.

标签： typescript generics

【解决方案1】：

将其与映射类型相交：

? { name: `${N}`, passed: true } & { [_ in N]: "Yes, baby!" }

如果这给出了关于 N 不是属性键的错误，您可能还必须添加一个推断约束：

T extends UnderTest<infer N extends string>

由于这种映射类型只有一个键和一个值，我们也可以使用Record 来实现相同的目的：

? { name: `${N}`, passed: true } & Record<N, "Yes, baby!">

【讨论】：