Typescript 内联 object 构造函数与 generics 导致类型太宽

Question

For a project I needed to create a type with two type generics to create single-key objects:

type MyVariant<K extends string, V> = {
    [key in K]: V
}

To create objects of this type I've written the following function:

function createVariant<K extends string, V>(key: K, value: V): MyVariant<K, V>  {
    return {
        [key]: value
    };
}

This function uses the same generic types for the input key and value as for the resulting variant. When using the shorthand inline constructor for the resulting object, typescript complains with the following message: Type '{ [x: string]: V; }' is not assignable to type 'MyVariant<K, V>' Type '{ [x: string]: V; }' is not assignable to type 'MyVariant<K, V>'

In my understanding the key type x shouldn't be of type string but of type K as this is the type it was given from the function parameters. To make typescript accept the return value, the function needs to be modified like so:

function createVariant<K extends string, V>(key: K, value: V): MyVariant<K, V>  {
    return {
        [key]: value
    } as MyVariant<K, V>;
}

In my opinion this is an unnecessary cast as the resulting type already matches the required output type. Is there a better way to build an object of MyVariant from generics that is accepted by typescript without having to cast the type to the required output?

Answer 1

This is a great case for using the type utility Record<Keys, Type> : you don't need MyVariant or the explicit return type for TS to correctly infer all of the information in your question:

function createVariant <K extends string, V>(key: K, value: V) {
  return { [key]: value } as Record<K, V>;
}

TS Playground

Note: I'm definitely not against explicit return types