How to access custom type value in Typescript

Question

I'm new in typescript and I couldn't find the answer so I would like to ask how can I access to custom type value?

Let's say I have my custom type like this

type Notes = {
  5: number;
  10: number;
  20: number;
}

and I create instance like this

const availableNotes: Notes = {
  5: 10,
  10: 20,
  20: 40,
};

I tried to access the values of availableNotes like this

const noteTypes: string[] = Object.keys(availableNotes);

for(let i = 0; i < noteTypes.length; i++) {
  const value = availableNotes[noteTypes[i]] 
  ... // Some logic
}

And this is an error

Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{ '5': number; '10': number; '20': number; }'.
  No index signature with a parameter of type 'string' was found on type '{ '5': number; '10': number; '20': number; }'

Appreciate your help!

Does this answer your question? [How can I iterate over a custom literal type in TypeScript?](https://stackoverflow.com/questions/40863488/how-can-i-iterate-over-a-custom-literal-type-in-typescript) — Adrian Kokot, Nov 13 '21 at 11:50
@AdrianKokot I don't think so because that answer is array instead of object. Appreciate your help anyway! — Gut, Nov 13 '21 at 11:52

score 1 · Accepted Answer · answered Nov 13 '21 at 12:20

So, I've spent some time trying different soultions and I've found a quite ugly one, but it works.

The whole magic is to cast type of the key to keyof Notes. At first, we need to cast noteTypes[i] to unknown, because TypeScript complies about casting string (noteTypes[i]) to keyof Notes directly.

Working example (tested on TypeScript v4.4.4 and v3.3.3):

type Notes = {
  5: number;
  10: number;
  20: number;
}

const availableNotes: Notes = {
  5: 10,
  10: 20,
  20: 40,
};

const noteTypes = Object.keys(availableNotes);

for(let i = 0; i < noteTypes.length; i++) {
  const key = noteTypes[i] as unknown as (keyof Notes);
  const value = availableNotes[key];
  console.log(value);
}

How to access custom type value in Typescript

1 Answers1