Reverse mapping in numeric enums in Typescript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of reverse mapping in numeric enum

What is the output of the following TypeScript code when compiled to JavaScript and run?

Typescript

enum Colors {
  Red = 1,
  Green,
  Blue
}

console.log(Colors[2]);

A undefined

B "Green"

C 2

D "Blue"

💡 Hint

Remember numeric enums create a reverse mapping from value to name.

In numeric enums, each numeric value maps back to its name. Since Green has value 2, Colors[2] returns "Green".

❓ Predict Output

intermediate

Reverse mapping with custom numeric values

What will be logged by this code snippet?

Typescript

enum Status {
  Pending = 5,
  Active = 10,
  Completed = 15
}

console.log(Status[10]);

A undefined

B "Pending"

C "Active"

D 10

💡 Hint

Check which enum member has the value 10.

The enum member Active has the value 10, so Status[10] returns "Active".

🧠 Conceptual

advanced

Why reverse mapping does not exist for string enums

Why does reverse mapping not work for string enums in TypeScript?

A Because string enums are not supported in TypeScript

B Because string enum values are not unique and cannot be used as keys

C Because string enums are compiled to objects without reverse mapping properties

D Because TypeScript only generates reverse mapping for numeric enums

💡 Hint

Think about how TypeScript compiles numeric vs string enums.

TypeScript generates reverse mapping only for numeric enums because numeric values can be used as keys. String enums do not have reverse mapping generated.

❓ Predict Output

advanced

Output when accessing reverse mapping with invalid key

What is the output of this code?

Typescript

enum Directions {
  Up = 1,
  Down,
  Left,
  Right
}

console.log(Directions[5]);

A undefined

B "Right"

C 5

D "Up"

💡 Hint

Check if the enum has a member with value 5.

No enum member has the value 5, so Directions[5] returns undefined.

🧠 Conceptual

expert

How reverse mapping affects enum object size

How does reverse mapping in numeric enums affect the size of the compiled enum object?

A It doubles the number of properties because each numeric value maps back to its name

B It reduces the size by removing duplicate keys

C It has no effect on the size of the enum object

D It triples the size because it adds extra metadata

💡 Hint

Think about how many keys exist in the compiled enum object compared to the number of enum members.

Numeric enums generate both name-to-value and value-to-name mappings, effectively doubling the number of properties in the compiled object.

Practice

1. What does reverse mapping in numeric enums in TypeScript allow you to do?

easy

A. Prevent enums from being changed at runtime

B. Convert enum names to strings automatically

C. Convert enum numeric values back to their corresponding names

D. Create string enums instead of numeric enums

Solution

1. Step 1: Understand numeric enums

   Numeric enums assign numbers to names and create a two-way map.

2. Step 2: Understand reverse mapping

   Reverse mapping lets you use the number to get the enum name back.

3. Final Answer:

   Convert enum numeric values back to their corresponding names -> Option C

4. Quick Check:

   Reverse mapping = number to name conversion [OK]

Hint: Remember: numeric enums map both ways: name↔number [OK]

Common Mistakes:

• Thinking reverse mapping converts names to strings
• Confusing string enums with numeric enums
• Assuming enums are immutable at runtime

2. Which of the following is the correct syntax to access the name from a numeric enum value 2 in TypeScript?

easy

A. EnumName['name']

B. EnumName[2]

C. EnumName.getName(2)

D. EnumName.2

Solution

1. Step 1: Recall enum reverse mapping syntax

   Numeric enums create a reverse map accessible by bracket notation with the number.

2. Step 2: Identify correct syntax

   Using EnumName[2] returns the name for value 2.

3. Final Answer:

   EnumName[2] -> Option B

4. Quick Check:

   Bracket notation with number = Enum name [OK]

Hint: Use bracket notation with number to get enum name [OK]

Common Mistakes:

• Using dot notation with a number (invalid syntax)
• Trying to call a non-existent getName method
• Using string keys instead of numeric keys

3. Given the enum:

enum Color { Red, Green, Blue }

What is the output of console.log(Color[1])?

medium

A. "Green"

B. "Red"

C. 1

D. undefined

Solution

1. Step 1: Understand enum default values

   By default, Red=0, Green=1, Blue=2 in numeric enums.

2. Step 2: Use reverse mapping

   Color[1] returns the name for value 1, which is "Green".

3. Final Answer:

   "Green" -> Option A

4. Quick Check:

   Color[1] = "Green" [OK]

Hint: Default enum starts at 0, so 1 maps to second name [OK]

Common Mistakes:

• Assuming enum values start at 1
• Expecting numeric output instead of string
• Confusing enum name with value

4. Consider this enum:

enum Status { Active = 1, Inactive, Pending }

What is wrong with this code?

console.log(Status[0]);

medium

A. It returns undefined because 0 is not a valid enum value

B. It causes a syntax error

C. It returns "Active" incorrectly

D. It throws a runtime exception

Solution

1. Step 1: Check enum values

   Status starts at 1, so valid values are 1, 2, 3 for Active, Inactive, Pending.

2. Step 2: Check reverse mapping for 0

   Status[0] does not exist, so it returns undefined.

3. Final Answer:

   It returns undefined because 0 is not a valid enum value -> Option A

4. Quick Check:

   Invalid enum value returns undefined [OK]

Hint: Check enum start value before reverse mapping [OK]

Common Mistakes:

• Expecting 0 to map to first enum name
• Thinking it causes syntax or runtime error
• Assuming reverse mapping always returns a string

5. Given this enum with custom values:

enum Direction { Up = 3, Down = 5, Left = 7, Right = 9 }

What will console.log(Direction[5]) output?

hard

A. 5

B. "Up"

C. undefined

D. "Down"

Solution

1. Step 1: Identify enum values

   Direction enum assigns Up=3, Down=5, Left=7, Right=9 explicitly.

2. Step 2: Use reverse mapping

   Direction[5] returns the name for value 5, which is "Down".

3. Final Answer:

   "Down" -> Option D

4. Quick Check:

   Reverse mapping works with custom numeric values [OK]

Hint: Reverse mapping works even with custom enum numbers [OK]

Common Mistakes:

• Assuming reverse mapping only works with default values
• Expecting numeric output instead of string
• Confusing enum names with values