在Typescript中键入Immutable.js映射

Question

I'm a newbie in Typescript and i'm trying to strongly type an Immutable Map (immutable.js library).

type AllowedValue =
    string |
    number |
    boolean |
    AllowedMap |
    AllowedList |
    TypedMap<any> |
    undefined;

interface AllowedList extends List<AllowedValue> {}

interface AllowedMap extends Map<string, AllowedValue> {}

export type MapTypeAllowedData<DataType> = {
    [K in keyof DataType]: AllowedValue;

};

export interface TypedMap<DataType extends MapTypeAllowedData<DataType>> extends Map<string, AllowedValue> {
    toJS(): DataType;
    get<K extends keyof DataType>(key: K, notSetValue?: DataType[K]): DataType[K];
    set<K extends keyof DataType>(key: K, value: DataType[K]): this;

}

const createTypedMap = <DataType extends MapTypeAllowedData<DataType>>(data: DataType): TypedMap<DataType> => Map(data) as any;

and I have this error.

Interface 'TypedMap<DataType>' incorrectly extends interface 'Map<string, AllowedValue>'.
  Types of property 'set' are incompatible.
    Type '<K extends keyof DataType>(key: K, value: DataType[K]) => this' is not assignable to type '(key: string, value: AllowedValue) => this'.
      Types of parameters 'key' and 'key' are incompatible.
        Type 'string' is not assignable to type 'keyof DataType'.
export interface TypedMap<DataType extends MapTypeAllowedData<DataType>> 
extends Map<string, AllowedValue> {
                    ~~~~~~~~

How can I solve it?

Answer 1

The error is correct... Your TypedMap<DataType> does not act like a Map<string, AllowedValue> . If I have a Map<string, AllowedValue> , I should be able to call get("randomString") on it. But TypedMap<DataType> only allows get() to be called with a parameter of type keyof DataType . So you get an error.

Perhaps you meant that TypedMap<DataType> should act like a Map<keyof DataType, AllowedValue> instead?

export interface TypedMap<DataType extends MapTypeAllowedData<DataType>>
  extends Map<keyof DataType, AllowedValue> { // changed here

  toJS(): DataType;
  get<K extends keyof DataType>(key: K, notSetValue?: DataType[K]): DataType[K];
  set<K extends keyof DataType>(key: K, value: DataType[K]): this;

}

That should hopefully act the way you want. Good luck!