How do I convert a string to enum in TypeScript?
To convert a string to an enum in TypeScript, you generally need to have a known mapping between the string and the enum member. You can either:
- Use a reverse mapping (if it’s a numeric enum), or
- Check if the string is a key of the enum (for string-based enums).
Below are typical approaches.
1. Numeric Enum Reverse Mapping
When you have a numeric enum, TypeScript emits both forward and reverse mappings at runtime, so you can do something like:
enum Color {
Red = 1,
Green,
Blue
}
function stringToColor(str: string): Color | undefined {
// Attempt to use the reverse mapping
const color = (Color as any)[str];
return typeof color === "number" ? color : undefined;
}
// Example usage:
console.log(stringToColor("Green")); // 2
console.log(stringToColor("Purple")); // undefined (not in enum)
Explanation:
(Color as any)[str]tries to look up the enum member namedstr.- If that is a number, we interpret it as a valid enum member.
Note: The “reverse mapping” trick only works for numeric enums. If Color is a string enum, the generated code doesn’t produce reverse mappings in the same way.
2. String Enum Lookup
With string enums, you don’t get a reverse mapping automatically. Instead, define a function or a dictionary that checks the string against known enum values:
enum Fruit {
Apple = "APPLE",
Banana = "BANANA",
Cherry = "CHERRY"
}
function stringToFruit(str: string): Fruit | undefined {
// Check if str is one of the enum’s values
if (Object.values(Fruit).includes(str as Fruit)) {
return str as Fruit;
}
return undefined;
}
// Usage:
console.log(stringToFruit("BANANA")); // "BANANA"
console.log(stringToFruit("PINEAPPLE")); // undefined
Or you can define a map from string to enum:
const fruitMap: Record<string, Fruit> = {
APPLE: Fruit.Apple,
BANANA: Fruit.Banana,
CHERRY: Fruit.Cherry
};
function toFruit(str: string): Fruit | undefined {
return fruitMap[str];
}
// Example:
console.log(toFruit("APPLE")); // "APPLE"
3. Summary
- Numeric enums let you do
(EnumType as any)[stringValue]to leverage the auto-generated reverse mapping— if it’s a valid key, you get the numeric value. - String enums don’t produce a reverse mapping, so you either:
- Check membership using
Object.values(...), or - Maintain a map/dictionary from strings to enum members.
- Check membership using
Bonus: If you want to strengthen your JavaScript foundations (which TypeScript builds upon), consider the Grokking JavaScript Fundamentals course by DesignGurus.io. It covers essential JS patterns (like prototypes, closures, async/await) that will help you use TypeScript’s advanced features more effectively.
Recommended Courses