Typescript 从TypeScrip中的其他类型检索泛型类型

发布于02月03日

假设我有一个Resource接口，它有大约translations个. 这是我翻译的模型的"记录库". 我对"真实"记录也有类似的界面，比如产品:

interface Translation {
    locale: string
}

interface Resource<T extends Translation> {
    translations: T[]
}

interface ProductTranslation {
  locale: string,
  title: string,
  status: number
}

interface Product {
  translations: ProductTranslation[]
}

我想编写一个"生成器"函数，该函数将为给定的翻译属性返回一个getter，例如，在Vanilla JS中:

function getTranslationValue(locale, key) {
  return (resource) => {
    const translation = resource.translations.find(t => t.locale === locale)
    return (translation && translation[key]) || null
  }
}

我发现在TS中编写它的唯一方法需要声明2个泛型类型:

资源类型(R<T>)
资源转换类型(T extends Translation)

就像这样:

function getTranslationValue<R extends Resource<T>, T extends Translation>(
    locale: R['translations'][number]['locale'], 
    key: keyof R['translations'][number]
) {
    return (resource: R) => {
        const translation = resource.translations.find(t => t.locale === locale)
        const value = translation && translation[key]
        return value ?? null
    }
}

然后，我可以这样使用它:

const getTitle = generateGetTranslationValue<Product, Product['translations'][number]>('en', 'title')
getTitle(myProduct)

有没有一种方法可以go 掉Product['translations'][number]声明，让调用看起来像这样:

const getTitle = generateGetTranslationValue<Product>('en', 'title')
getTitle(myProduct)

function getTranslationValue<R extends Resource<Translation>>( locale: R['translations'][number]['locale'], key: keyof R['translations'][number] ) { return (resource: R) => { const translation = resource.translations.find(t => t.locale === locale) // const translation: Translation | undefined, oops, const value = translation && translation[key] // error // ------------------------> ~~~~~~~~~~~~~~~~ // Type 'keyof R["translations"][number]' cannot be used to index type 'Translation'. return value ?? null } }

function getTranslationValue<R extends Resource<Translation>>( locale: R['translations'][number]['locale'], key: keyof R['translations'][number] ) { return (resource: R) => { const translations: R['translations'][number][] = resource.translations; const translation = translations.find(t => t.locale === locale) const value = translation && translation[key] return value ?? null } } const getTitle = getTranslationValue<Product>('en', 'title'); // const getTitle: (resource: Product) => NonNullable<string | number> | null

function getTranslationValue<R extends Resource<Translation>>( locale: R['translations'][number]['locale'], key: keyof R['translations'][number] ) { return (resource: Extract<R, Resource<R['translations'][number]>>) => { const translation = resource.translations.find(t => t.locale === locale) const value = translation && translation[key] return value ?? null } } const getTitle = getTranslationValue<Product>('en', 'title') // const getTitle: (resource: Product) => NonNullable<string | number> | null

Typescript 从TypeScrip中的其他类型检索泛型类型

推荐答案

Typescript相关问答推荐

当使用`type B = A`时，B的类型显示为A.为什么当`type B = A时显示为`any `｜用A代替？

如何将联合文字类型限制为文字类型之一

TypeScrip 5.3和5.4-对`Readonly<；[...number[]，字符串]>；`的测试版处理：有什么变化？

在分配给类型的只读变量中维护const的类型

诡异的文字类型--S为物语的关键

Fp-ts使用任务的最佳方法包装选项

推断从其他类型派生的类型

如何在省略一个参数的情况下从函数类型中提取参数类型？

如何键入并类型的函数&S各属性

是否可以在类型脚本中定义条件返回类型，而不在函数体中使用类型转换？

可赋值给类型的类型，从不赋值

在TypeScript中，如何通过一系列过滤器缩小类型？

我可以将一个类型数组映射到TypeScrip中的另一个类型数组吗？

来自枚举的<；复选框和组件列表

在对象数组中设置值

将带有额外id属性的Rust struct 展平回TypeScript单个对象，以返回wasm-bindgen函数

Typescript泛型-键入对象时保持推理

如何让Record中的每个值都有独立的类型？

Typescript 和 Rust 中跨平台的位移数字不一致

const 使用条件类型时，通用类型参数不会推断为 const