Why enums are needed in Typescript - Challenge Your Understanding

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the output of this enum usage?

Consider this TypeScript code using an enum. What will be printed to the console?

Typescript

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

console.log(Direction.Up);
console.log(Direction[2]);

A 2 and 'Down'

B 1 and 'Down'

C 1 and 'Up'

D 0 and 'Up'

💡 Hint

Remember enums auto-increment numeric values starting from the first assigned value.

The enum Direction starts with Up = 1. The next members auto-increment, so Down is 2, Left is 3, and Right is 4.

Accessing Direction.Up prints 1. Accessing Direction[2] returns the name of the member with value 2, which is 'Down'.

🧠 Conceptual

intermediate

Why use enums instead of plain constants?

Which of the following is the main reason to use enums in TypeScript instead of just using plain constants or strings?

A Enums group related values and provide readable names with automatic numbering.

B Enums make the code run faster than constants.

C Enums allow you to use variables without declaring them first.

D Enums automatically convert strings to numbers in all cases.

💡 Hint

Think about how enums help organize related values.

Enums help group related named values together, making code easier to read and maintain. They also provide automatic numbering and reverse mapping.

They do not affect runtime speed or variable declaration rules.

🔧 Debug

advanced

What error does this enum code produce?

What error will this TypeScript code cause when compiled or run?

Typescript

enum Status {
  Active = 'ACTIVE',
  Inactive = 'INACTIVE',
  Pending
}

console.log(Status.Pending);

A Output: 2

B Output: 'PENDING'

C Error: Enum member must have initializer because previous member is a string

D No error, outputs undefined

💡 Hint

Check how string enums require explicit values for all members.

When an enum member is assigned a string value, all following members must also have initializers. Here, Pending has no value, causing a compile error.

🚀 Application

advanced

How many items are in this enum object?

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

Typescript

enum Colors {
  Red,
  Green,
  Blue
}

A 6

B 0

C 3

D 9

💡 Hint

Remember TypeScript enums create reverse mappings for numeric values.

Numeric enums create both forward (name to value) and reverse (value to name) mappings. For 3 members, there are 6 keys total.

❓ Predict Output

expert

What is the output of this mixed enum code?

What will this TypeScript code print to the console?

Typescript

enum Mixed {
  A = 1,
  B = 'B',
  C = 3
}

console.log(Mixed.A);
console.log(Mixed.B);
console.log(Mixed.C);
console.log(Mixed['B']);

A 1, 'B', 3, undefined

B 1, 'B', 3, 1

C Error at enum declaration

D 1, 'B', 3, 'B'

💡 Hint

Check how mixed enums handle reverse mapping for string members.

The mixed enum compiles successfully. Mixed.A is 1 (with reverse Mixed[1] = 'A'), Mixed.B is 'B' (no reverse mapping Mixed['B'] = 'B' created), Mixed.C is 3 (with reverse Mixed[3] = 'C'). However, Mixed['B'] accesses the forward mapping property 'B', which holds 'B'. Outputs: 1, 'B', 3, 'B'.