在 TypeScript 检查之前修改 prop 值答案

【问题标题】：Modify prop value before TypeScript check在 TypeScript 检查之前修改 prop 值
【发布时间】：2021-11-25 14:45:03
【问题描述】：

这是我得到的对象：

const translations = {
    msg_hello: 'Hello',
    msg_bye: 'Bye'
}

我还有一个看起来像这样的函数：

const generateTranslation = (partialKey: string): keyof typeof translations {
    return `msg_${partialKey}`;
}

有没有办法检查生成的翻译密钥是否有效？例如：

generateTranslation('hello'); // good
generateTranslation('no'); // bad

【问题讨论】：

标签： typescript type-inference typescript-generics

【解决方案1】：

首先，您需要从translations 中提取允许的值。为此，您需要使 translations 不可变。

const translations = {
    msg_hello: 'Hello',
    msg_bye: 'Bye'
} as const;

然后，为了可读性，你可以创建辅助类型：

type Translations = typeof translations;

感谢template literals，您可以推断出下划线_之后的字符串：

type GetSuffix<T> = keyof T extends `msg_${infer Suffix}` ? Suffix : never;

type Test = GetSuffix<Translations> // "hello" | "bye"

现在，您可以应用限制了：


const generateTranslation = <
    Key extends GetSuffix<Translations>
>(partialKey: Key): `msg_${Key}` => `msg_${partialKey}`

请注意，我在 GetSuffix<Translations> 的帮助下推断出 partialKey，这有助于我应用显式返回类型 msg_${Key}。

整个例子：

const translations = {
    msg_hello: 'Hello',
    msg_bye: 'Bye'
} as const;

type Translations = typeof translations;

type GetSuffix<T> = keyof T extends `msg_${infer Suffix}` ? Suffix : never

type Test = GetSuffix<Translations> // "hello" | "bye"

const generateTranslation = <
    Key extends GetSuffix<Translations>
>(partialKey: Key): `msg_${Key}` => `msg_${partialKey}`

const result = generateTranslation('hello'); // good --->  "msg_hello"
generateTranslation('no'); // bad

Playground

【讨论】：

【解决方案2】：

我认为没有一种自动的方法可以做到这一点，对于像keyof 这样的动态字符串不会检索它们。但是您可以手动创建一个作为有效值联合的类型，并要求 partialKey 参数属于该类型：

const translations = {
    msg_hello: 'Hello',
    msg_bye: 'Bye'
};

type validPartialKeys = 'hello' | 'bye';

const generateTranslation = function (partialKey: validPartialKeys): keyof typeof translations {
    return `msg_${partialKey}`;
}

generateTranslation('hello'); // good
generateTranslation('no'); // bad

【讨论】：