Numeric enums in Typescript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of numeric enum auto-increment

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

Typescript

enum Direction {
  Up,
  Down,
  Left,
  Right
}
console.log(Direction.Up, Direction.Down, Direction.Left, Direction.Right);

A 1 2 3 4

B 0 1 2 3

C Up Down Left Right

D undefined undefined undefined undefined

💡 Hint

Numeric enums start numbering from 0 by default unless specified.

By default, numeric enums start at 0 and increment by 1 for each member. So Up is 0, Down is 1, Left is 2, and Right is 3.

❓ Predict Output

intermediate

Custom starting value in numeric enum

What will this TypeScript code output when run?

Typescript

enum Status {
  Ready = 5,
  Waiting,
  Complete
}
console.log(Status.Ready, Status.Waiting, Status.Complete);

A 0 1 2

B 5 5 5

C 5 6 7

D undefined undefined undefined

💡 Hint

When you assign a number to the first member, the next members increment from that number.

The first member Ready is set to 5, so Waiting becomes 6 and Complete becomes 7 automatically.

🔧 Debug

advanced

Why does this enum cause an error?

This TypeScript enum code causes a compilation error. What is the reason?

Typescript

enum Colors {
  Red = 1,
  Green = Red + "2",
  Blue
}

A Enum members must be initialized with constant values or previous enum members without expressions.

B You cannot use string concatenation in numeric enum values.

C Blue must be assigned a value explicitly after Green uses an expression.

D Enums cannot mix string and numeric values.

💡 Hint

Enum values must be constant expressions for numeric enums.

Numeric enum members must be initialized with constant values or expressions that resolve to constants. Using string concatenation results in a non-constant expression, causing an error.

❓ Predict Output

advanced

Reverse mapping of numeric enums

What is the output of this TypeScript code?

Typescript

enum Weekday {
  Monday = 1,
  Tuesday,
  Wednesday
}
console.log(Weekday[2]);

A undefined

B 2

C "Monday"

D "Tuesday"

💡 Hint

Numeric enums create a reverse mapping from value to name.

Numeric enums in TypeScript create a reverse mapping, so Weekday[2] returns the name of the member with value 2, which is "Tuesday".

🧠 Conceptual

expert

Number of enum members after compilation

Given this TypeScript enum, how many keys will the compiled JavaScript object have?

Typescript

enum Levels {
  Low = 1,
  Medium = 3,
  High
}

A 6

B 3

C 5

D 4

💡 Hint

Remember that numeric enums create both forward and reverse mappings for each member.

Each enum member creates two keys: one for the name to value and one for the value to name. Since High is 4 (3 + 1), there are 3 members, so 3 * 2 = 6 keys.

Practice

1. What is a numeric enum in TypeScript used for?

easy

A. To declare variables without types

B. To assign names to numeric values for better code clarity

C. To define functions with numeric parameters

D. To create string-only constants

Solution

1. Step 1: Understand enum purpose

   Numeric enums give meaningful names to numbers, making code easier to read.

2. Step 2: Compare options

   Only To assign names to numeric values for better code clarity correctly describes numeric enums as naming numbers for clarity.

3. Final Answer:

   To assign names to numeric values for better code clarity -> Option B

4. Quick Check:

   Numeric enums = named numbers [OK]

Hint: Enums name numbers to avoid magic numbers [OK]

Common Mistakes:

• Confusing enums with string constants
• Thinking enums declare variables
• Assuming enums define functions

2. Which of the following is the correct syntax to declare a numeric enum in TypeScript?

easy

A. enum Colors { Red = 1, Green, Blue }

B. enum Colors = { Red: 1, Green: 2, Blue: 3 }

C. enum Colors (Red = 1, Green, Blue)

D. enum Colors { Red: 1; Green; Blue }

Solution

1. Step 1: Recall enum syntax

   TypeScript enums use curly braces with members separated by commas, and assignment uses '='.

2. Step 2: Check each option

   enum Colors { Red = 1, Green, Blue } uses correct syntax: enum name, braces, members with '=' and commas.

3. Final Answer:

   enum Colors { Red = 1, Green, Blue } -> Option A

4. Quick Check:

   Correct enum syntax uses braces and '=' [OK]

Hint: Use braces and '=' for enum members [OK]

Common Mistakes:

• Using '=' after enum name
• Using colons instead of '=' for values
• Separating members with semicolons

3. What will be the output of this code?

enum Status {
  Ready = 3,
  Waiting,
  Done
}
console.log(Status.Waiting);

medium

A. 3

B. 5

C. 4

D. undefined

Solution

1. Step 1: Understand enum auto-increment

   Ready is set to 3, so Waiting becomes 4, and Done becomes 5 automatically.

2. Step 2: Identify logged value

   console.log(Status.Waiting) prints 4, the auto-incremented value after 3.

3. Final Answer:

   4 -> Option C

4. Quick Check:

   Auto-increment after 3 = 4 [OK]

Hint: Next enum value auto-increments by 1 [OK]

Common Mistakes:

• Assuming Waiting equals 3
• Thinking enum values reset automatically
• Expecting string output

4. Identify the error in this enum declaration:

enum Direction {
  Up = 1,
  Down = 2
  Left = 3,
  Right = 4
}

medium

A. Cannot mix assigned and unassigned members

B. Enum members cannot have assigned values

C. Enum name must be lowercase

D. Missing comma after Down = 2

Solution

1. Step 1: Check enum member separators

   Enum members must be separated by commas. After 'Down = 2' there is no comma.

2. Step 2: Validate other rules

   Assigned values are allowed, enum names can be uppercase, and mixing assigned/unassigned is allowed.

3. Final Answer:

   Missing comma after Down = 2 -> Option D

4. Quick Check:

   Enum members need commas [OK]

Hint: Check commas between enum members [OK]

Common Mistakes:

• Forgetting commas between members
• Thinking enum names must be lowercase
• Believing all members must be unassigned

5. Given this enum:

enum Levels {
  Low = 1,
  Medium = Low * 2,
  High = Medium + 2
}

What is the value of Levels.High?

hard

A. 4

B. 6

C. 5

D. 8

Solution

1. Step 1: Calculate Medium value

   Medium = Low * 2 = 1 * 2 = 2.

2. Step 2: Calculate High value

   High = Medium + 2 = 2 + 2 = 4.

3. Step 3: Re-check calculations

   Medium is 2, High is 4. This is correct.

4. Step 4: Confirm enum constant expressions

   TypeScript allows constant expressions. Low=1, Medium=2, High=4.

5. Final Answer:

   4 -> Option A

6. Quick Check:

   Levels.High = 4 [OK]

Hint: Calculate enum expressions step-by-step [OK]

Common Mistakes:

• Ignoring expression evaluation order
• Assuming High equals Medium + Low
• Confusing enum values with indexes