Heterogeneous enums in Typescript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to declare a heterogeneous enum with a string and a number.

Typescript

enum Status {
  Active = [1],
  Inactive = 0
}

Drag options to blanks, or click blank then click option'

A"1"

B1

Ctrue

D"ACTIVE"

Attempts:

3 left

💡 Hint

Common Mistakes

Assigning a number without quotes for a string member.

Using boolean values in enums.

The enum member 'Active' is assigned a string value "ACTIVE" to create a heterogeneous enum with both string and number values.

2fill in blank

medium

Complete the code to access the string value of the enum member.

Typescript

const currentStatus = Status.[1];

Drag options to blanks, or click blank then click option'

AInactive

B0

CActive

D1

Attempts:

3 left

💡 Hint

Common Mistakes

Using the numeric value instead of the member name.

Using lowercase member names.

Accessing 'Status.Active' returns the string value "ACTIVE" assigned in the enum.

3fill in blank

hard

Fix the error in the enum declaration to correctly mix string and number values.

Typescript

enum Response {
  Yes = [1],
  No = "NO"
}

Drag options to blanks, or click blank then click option'

Anull

B1

Ctrue

D"YES"

Attempts:

3 left

💡 Hint

Common Mistakes

Using boolean or null values in enums.

Missing quotes for string values.

Assigning the number 1 to 'Yes' allows the enum to be heterogeneous with string and number values.

4fill in blank

hard

Fill both blanks to create a heterogeneous enum with a string and a number.

Typescript

enum Direction {
  Up = [1],
  Down = [2]
}

Drag options to blanks, or click blank then click option'

A"UP"

B0

C1

D"DOWN"

Attempts:

3 left

💡 Hint

Common Mistakes

Assigning numbers as strings or vice versa.

Using the same type for both members.

The enum 'Direction' has 'Up' as a string "UP" and 'Down' as a number 1, making it heterogeneous.

5fill in blank

hard

Fill all three blanks to create a heterogeneous enum with string and number values and access a member.

Typescript

enum Mode {
  Read = [1],
  Write = [2],
}
const modeValue = Mode.[3];

Drag options to blanks, or click blank then click option'

A"READ"

B2

CWrite

D1

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing up member names and values when accessing.

Using numbers as strings or vice versa.

The enum 'Mode' has 'Read' as string "READ" and 'Write' as number 1. Accessing 'Mode.Write' returns 1.

Practice

1.

What is a heterogeneous enum in TypeScript?

easy

A. An enum that contains both string and numeric values.

B. An enum that only contains numeric values.

C. An enum that only contains string values.

D. An enum that cannot be used with functions.

Solution

1. Step 1: Understand enum value types

   Enums in TypeScript can hold numeric or string values.

2. Step 2: Define heterogeneous enum

   A heterogeneous enum mixes both string and numeric values in the same enum.

3. Final Answer:

   An enum that contains both string and numeric values. -> Option A

4. Quick Check:

   Heterogeneous enum = mixed string and number values [OK]

Hint: Remember: mixed types in one enum means heterogeneous [OK]

Common Mistakes:

• Thinking enums can only have one type of value
• Confusing heterogeneous with union types
• Assuming enums can't mix strings and numbers

2.

Which of the following is the correct syntax to declare a heterogeneous enum?

enum Status {
  Active = 1,
  Inactive = "NO"
}

easy

A. Incorrect because enum members must be all strings.

B. Incorrect because enums cannot have string values.

C. Incorrect because enum members must be all numbers.

D. Correct syntax with mixed number and string values.

Solution

1. Step 1: Check enum member types

   The enum has one numeric value (1) and one string value ("NO").

2. Step 2: Validate TypeScript enum rules

   TypeScript allows heterogeneous enums mixing numbers and strings.

3. Final Answer:

   Correct syntax with mixed number and string values. -> Option D

4. Quick Check:

   Mixed values in enum = valid heterogeneous enum [OK]

Hint: Look for mixed number and string values in enum members [OK]

Common Mistakes:

• Assuming enums can't have string values
• Thinking all enum members must be same type
• Confusing enum syntax with object literals

3.

What will be the output of the following TypeScript code?

enum Mixed {
  Yes = 1,
  No = "NO"
}
console.log(Mixed.Yes);
console.log(Mixed.No);
console.log(Mixed[1]);

medium

A. Yes, NO, 1

B. 1, NO, Yes

C. 1, NO, undefined

D. NO, 1, Yes

Solution

1. Step 1: Check enum values

   Mixed.Yes is 1, Mixed.No is "NO".

2. Step 2: Understand reverse mapping

   Numeric enums have reverse mapping, so Mixed[1] returns "Yes".

3. Final Answer:

   1, NO, Yes -> Option B

4. Quick Check:

   Numeric enum reverse lookup works, string does not [OK]

Hint: Only numeric enum members have reverse mapping [OK]

Common Mistakes:

• Expecting string enum members to have reverse mapping
• Confusing enum member names with values
• Assuming Mixed[1] returns 1

4.

Identify the error in this heterogeneous enum declaration:

enum Colors {
  Red = "RED",
  Green,
  Blue = 3
}

medium

A. Enums cannot mix string and number values.

B. Blue cannot be assigned a number after a string member.

C. Green must have an explicit string or number value.

D. Red cannot be assigned a string value.

Solution

1. Step 1: Check enum member values

   Red is assigned a string "RED". Green has no value assigned.

2. Step 2: Understand enum auto-increment rules

   After a string member, numeric auto-increment is not allowed. Green must have explicit value.

3. Final Answer:

   Green must have an explicit string or number value. -> Option C

4. Quick Check:

   Members after string need explicit values [OK]

Hint: After string enum member, next must have explicit value [OK]

Common Mistakes:

• Assuming auto-increment works after string member
• Thinking enums can't mix types at all
• Ignoring missing value for Green

5.

You want to create a heterogeneous enum to represent user roles with numeric IDs and string labels. Which enum declaration correctly achieves this?

enum UserRole {
  Admin = 1,
  Guest = "GUEST",
  Member = 2
}

hard

A. This enum is valid and mixes numbers and strings correctly.

B. This enum is invalid because Guest must be a number.

C. This enum is invalid because Admin and Member must be strings.

D. This enum is invalid because Member cannot be a number after a string.

Solution

1. Step 1: Analyze enum member assignments

   Admin=1 (number), Guest="GUEST" (string), Member=2 (number). All explicitly assigned.

2. Step 2: Validate heterogeneous enum rules

   TypeScript allows explicit mixing of numeric and string values in enums.

3. Final Answer:

   This enum is valid and mixes numbers and strings correctly. -> Option A

4. Quick Check:

   Explicit assignments allow mixing numbers after strings [OK]

Hint: Explicit numeric assignments work after string members [OK]

Common Mistakes:

• Thinking numbers cannot follow strings even explicitly
• Confusing explicit assignments with auto-increment rules
• Assuming strict ordering prevents mixing