TypeScript - Using Generics to Create a Custom Type

Question

I'm using an intermediary step for creating a type that has property keys that must be the same as the keys of a specified interface

// 1. Create Interface
interface IDetail {
    name: string;
    enabled: boolean;
}

// 2. Create a 'type' that has properties that match the properties of an interface
type DetailType = {
    [key in keyof IDetail]: any
}

// 3. Apply the type to an object literal
const control: DetailType = {
    name: [],
    enabled: []
}

I repeat this pattern quite often, and I'm wondering is there a way to generalize the 2nd step - possibly using generics?

What is the purpose of the type? Since you map it to any you lose type information.. — Murat Karagöz
– Murat Karagöz, Commented Apr 17, 2019 at 8:48

hoangdv · Accepted Answer · 2019-04-17 09:10:41Z

1

You can make a special generic type:

type WrapMyType<T, V> = { [key in keyof T]: V };

const control: WrapMyType<IDetail, any> = {
  name: [],
  enabled: [],
};

answered Apr 17, 2019 at 9:10

hoangdv

16.3k4 gold badges31 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Roberto Zvjerković · Accepted Answer · 2019-04-17 08:50:19Z

1

Well you can just make your type generic:

interface IDetail {
  name: string;
  enabled: boolean;
}

type Generic<T> = { [key in keyof T]: any };

const controlGeneric: Generic<IDetail> = {
  name: [],
  enabled: []
};

answered Apr 17, 2019 at 8:50

Roberto Zvjerković

10.2k4 gold badges31 silver badges49 bronze badges

Comments

Murat Karagöz · Accepted Answer · 2019-04-17 08:59:21Z

-1

If you don't want to lose the types you can use this approach

type DetailType<T> = { [key in keyof T]: T[key] };

const control: DetailType<IDetail> = {
    name: [], // must be string
    enabled: [] // must be boolean
}

answered Apr 17, 2019 at 8:59

Murat Karagöz

37.8k16 gold badges82 silver badges114 bronze badges

Collectives™ on Stack Overflow

TypeScript - Using Generics to Create a Custom Type

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related