How can I iterate over a custom literal type in TypeScript?

I have defined a custom literal type in TypeScript:

export type Market = 'au'|'br'|'de';

Now I want to iterate over each possible Market without having to create an array of Market[] in the first place as it feels redundant and I may forget to add one option:

const markets: Market[] = ['au', 'br', 'de'];
markets.forEach((market: Market) => {
    console.log(market);
});

Is there a way to achieve that with TypeScript?


Solution 1:

For those of you visiting this question using TypeScript >= 3.4, I believe the best practice is now to create a constant array of strings and then use the type of operator.

Example:

export const markets = ['au', 'br', 'de'] as const;
export type Market = typeof markets[number];

markets.forEach((market: Market) => {
    console.log(market);
});

Solution 2:

No, you can't do that, as pure type information like that doesn't exist at runtime.

It's hypothetically plausible to do the other way (define a normal list of strings, and then derive the 'au'|'br'|'de' type from that), but I don't think the TypeScript compiler (either 2.0 or 2.1) will currently infer that for you - as far as I know the type of markets will always be string[] normally.

The right answer to this is to use enums. They define a type with each of their values, and it's possible to get a list of all their string values: How to programmatically enumerate an enum type in Typescript 0.9.5?.

The one downside to enums is that their runtime representation is different (under the hood they're actually numbers, not strings). Your code can still treat them as nice readable values though, it's just you'll have to translate them to strings if do you ever you need them as string names at runtime. That's easy though: given enum MarketEnum and a value myEnumValue, MarketEnum[myEnumValue] is the value's name as a string).

Solution 3:

Complete example for TypeScript 3.9 that I think is the easiest to follow:

enum SupportedLangugesEnum {
    'au' = 'au',
    'br' = 'br',
    'de' = 'de',
}

for (let entry in SupportedLangugesEnum) {
    if (isNaN(Number(entry))) {
        console.log(entry);
    }
}

for (let entry of Object.keys(SupportedLangugesEnum)) {
    console.log(entry);
}

for (let entry of Object.values(SupportedLangugesEnum)) {
    console.log(entry);
}

Will print:

enter image description here

Source:

https://stackoverflow.com/a/39372911/3850405

Solution 4:

Here's an alternative way:

enum Market {
   'eu' = 'eu',
   'us' = 'us',
}

const all_possible_market_values = getStringValuesFromEnum(Market)

function getStringValuesFromEnum<T>(myEnum: T): (keyof T)[] {
   return Object.keys(myEnum) as any
}

The underlying representation is no longer numbers. It's the string.

"use strict";
var Market;

(function (Market) {
    Market["eu"] = "eu";
    Market["us"] = "us";
})(Market || (Market = {}));

const all_possible_market_values = getStringValuesFromEnum(Market);

function getStringValuesFromEnum(myEnum) {
    return Object.keys(myEnum);
}