Question

我正在创建一个类似函数的映射，它将像这样旋转一个对象：

const configObject: ConfigObject = {
    a: {
        oneWay: (value: string) => 99,
        otherWay: (value: number) => "99"
    },


    b: {
        oneWay: (value: number) => undefined,
        otherWay: () => 99
    }
}

进入：

{
    foos: {
        a: {
            convert: (value: string) => 99,
        },
        b: {
            convert: (value: number) => undefined
        }
    },


    bars: {
        a: {
            deconvert: (value: number) => "99",
        },
        b: {
            deconvert: () => 99;
        }
    }
}

我遇到的问题是基于ConfigItem的签名来强制执行函数参数和返回类型。

我的操作方式如下：

interface ConfigItem<P, Q> {
    oneWay: (value: P) => Q;
    otherWay: (value: Q) => P;
}

type ConfigObject = Record<string, ConfigItem<any, any>>; //This is right, I believe. 
// any is explicitly an OK type for the ConfigItems to have. 

interface Foo<A, B> {
    convert: (a: A) => B;
}

interface Bar<A, B> {
    deconvert: (b: B) => A;
}

interface MyThing<T extends ConfigObject> {
    foos: Record<keyof T, Foo<any, any>> //These are wrong - they should use the types as defined by the config object
    bars: Record<keyof T, Bar<any, any>>
}

我后来实现了一个创建MyThing的功能，例如：

function createMyThing<T extends ConfigObject>(configObject: T): MyThing<T> {
    //I would use Object.entries, but TS Playground doesn't like it. 
    const keys = Object.keys(configObject);
    return {
        foos: keys.reduce((acc, key) => {
            return {
                ...acc,
                [key]: {
                    convert: configObject[key].oneWay
                }
            }
        }, {} as Record<keyof T, Foo<any, any>>), //Again problematic 'any' types. 

        bars: keys.reduce((acc, key) => {
            return {
                ...acc,
                [key]: {
                    deconvert: configObject[key].otherWay
                }
            };

        }, {}) as Record<keyof T, Bar<any, any>>

    };
}

现在此代码有效：



const configObject: ConfigObject = {
    a: {
        oneWay: (value: string) => 99,
        otherWay: (value: number) => "99"
    },


    b: {
        oneWay: (value: number) => undefined,
        otherWay: () => 99
    }
}
const myThing = createMyThing(configObject); 

console.log(myThing.foos.a.convert("hello"));  
console.log(myThing.foos.b.convert("hello"));  //No type enforcement!

但是由于这些语句，我们没有任何类型强制。

我将如何修改我的代码以使其正常工作？

Full TypeScript playground here.

Second attempt at a solution using the infer keyword

Answer 1

您应该考虑的第一件事是不要将configObject类型设置为ConfigObject，因为这样会丢失对象的结构。创建扩展ConfigObject的具体接口：

interface ConcreteConfigObject extends ConfigObject{
    a: ConfigItem<string, number>;
    b: ConfigItem<number, undefined>;
}

在MyThing中摆脱any的情况，您可以结合几种TS功能从configObject中提取类型：

Parameters<T>-构造函数类型T的参数类型的元组类型
ReturnType<T>-构造由函数T的返回类型组成的类型
Index types-使用索引类型，可使编译器检查使用动态属性名称的代码。例如，选择属性的子集
Mapped Types-映射类型允许您通过映射属性类型从现有类型创建新类型

上面，我们从oneWay和otherWay方法中提取参数并返回类型，以设置为Foo<A, B>和Bar<A, B>：

interface MyThing<T extends ConfigObject> {
    foos: MyThingFoo<T>;
    bars: MyThingBar<T>;
}

type MyThingFoo<T extends ConfigObject> = {
    [k in keyof T]: Foo<Parameters<T[k]["oneWay"]>[0], ReturnType<T[k]["oneWay"]>>;
}

type MyThingBar<T extends ConfigObject> = {
    [k in keyof T]: Bar<ReturnType<T[k]["otherWay"]>, Parameters<T[k]["otherWay"]>[0]>;
}

TypeScript Playground

P.S。从T提取类型看起来很丑，可以做一些优化，我只是为说明目的而明确编写了它。

Answer 2

在Typescript中，可以使用window.prompt()从现有值中提取类型签名：

typeof

基于const configObject = { a: { oneWay: (value: string) => 99, otherWay: (value: number) => "99" }, b: { oneWay: (value: number) => undefined, otherWay: () => 99 } }; type ConfigObject = typeof configObject，您可以创建ConfigObject，例如：

MyThing

为完整性起见，type MyThing = { foos: { [K in keyof ConfigObject]: { convert: ConfigObject[K]['oneWay']}} bars: { [K in keyof ConfigObject]: { deconvert: ConfigObject[K]['otherWay']}} }可以键入为：

createMyThing

Demo

Answer 3

type PropType<T, K extends keyof T> = T[K];
type FooObjType<T> = { [M in keyof T]: Foo<T[M] extends ConfigItem<any, any> ? PropType<T[M], 'oneWay'> : any> }
type BarObjType<T> = { [M in keyof T]: Bar<T[M] extends ConfigItem<any, any> ? PropType<T[M], 'otherWay'> : any> }

注意：我添加了一项检查，以查看T [M]值是否扩展了ConfigItem只是一个预防措施。

这些类型将有助于定义。类型的名称是任意的。

const configObject = {
    a: {
        oneWay: (value: string) => 99,
        otherWay: (value: number) => "99"
    } as ConfigItem<string, number>,


    b: {
        oneWay: (value: number) => undefined,
        otherWay: () => 99
    } as ConfigItem<number, undefined>
}

在configObject中添加每个对象的转换。

interface MyThing<T extends ConfigObject> {
    foos: FooObjType<T>,
    bars: BarObjType<T>
}

更新了MyThing界面

function createMyThing<T extends ConfigObject>(configObject: T): MyThing<T> {


    const keys = Object.keys(configObject);
    return {

        foos: keys.reduce((acc, key) => {
            return {
                ...acc,
                [key]: {
                    convert: configObject[key].oneWay
                }
            }
        }, {} as FooObjType<T>),

        bars: keys.reduce((acc, key) => {
            return {
                ...acc,
                [key]: {
                    deconvert: configObject[key].otherWay
                }
            };

        }, {} as BarObjType<T>),

    };
}

更新了createMyThing函数。

interface ConfigItem<P, Q> {
    oneWay: (value?: P) => Q;
    otherWay: (value?: Q) => P;
}

对ConfigItems界面中的函数签名进行小的修改，以允许空参数

从键值对中推断类型，其中值是函数签名？

3 个答案: