是否可以从字符串模板文字内部推断泛型类型

Tru*_*ufa 3 javascript generics type-inference typescript typescript-generics

下面的代码完全符合我想要知道的功能,但有一点需要注意,我想避免必须明确它所需的泛型。

type EventGroup = {
  actions: "run" | "save"
  other: "bla"
}

export type EventType<T extends keyof EventGroup> = `${T}/${EventGroup[T]}`

const t: EventType<"actions"> = "actions/run"
Run Code Online (Sandbox Code Playgroud)

我希望 Typescript 能够推断出:

`actions/run` -> valid
`actions/save` -> valid
`actions/bla` -> NOT valid
`other/bla` -> valid
Run Code Online (Sandbox Code Playgroud)

这就是这段代码的作用,但具有显式泛型。

T.J*_*der 5

您可以使用映射类型来做到这一点,然后从以下位置获取值的并集:

export type EventType = {
    [Key in keyof EventGroup]: `${Key}/${EventGroup[Key]}`
}[keyof EventGroup];
Run Code Online (Sandbox Code Playgroud)

测试类型的有效性:

const t1: EventType = "actions/run";  // valid
const t2: EventType = "actions/save"; // valid
const t3: EventType = "actions/bla";  // NOT valid
const t4: EventType = "other/bla";    // valid
Run Code Online (Sandbox Code Playgroud)

游乐场链接

有两个部分,首先是映射类型:

type EventType = {
    [Key in keyof EventGroup]: `${Key}/${EventGroup[Key]}`
}
Run Code Online (Sandbox Code Playgroud)

其评估结果为:

type EventType = {
    actions: "actions/run" | "actions/save";
    other: "other/bla";
}
Run Code Online (Sandbox Code Playgroud)

然后我们使用on 来提取和[keyof EventGroup]的值作为并集。actionsother