Tuples and Enums

Both Tuples and Enums are tools used to provide more structure and predictability to your data, but they solve different problems.

Tuples

A Tuple is essentially a "strict array." While regular arrays usually hold many items of the same type, a tuple has a fixed length and requires specific types at specific positions.

Key Features:

• Order Matters: You cannot swap the position of the data types.
• Fixed Length: By default, it expects exactly the number of elements defined.

Example:

let user: [string, number];

user = ["David", 30];   // ✅ OK
user = [30, "David"];   // ❌ Error: The first element must be a string.

Advanced Tuples:

• Optional (?): You can mark elements as optional if they aren't always present.
• Readonly: Prevents any changes to the tuple after it is created.

let coords: [number, number?] = [10]; // Second item is optional
let rgb: readonly [number, number, number] = [255, 0, 0]; // Cannot be changed

Tuples in Function Returns

A common and practical use of tuples is returning multiple values from a function in a predictable, typed order. This pattern will feel familiar if you have used React's useState hook, which returns a tuple of [value, setter].

function useToggle(initial: boolean): [boolean, () => void] {
  let state = initial;
  const toggle = () => { state = !state; };
  return [state, toggle];
}

const [isOpen, toggleOpen] = useToggle(false);
// isOpen is boolean, toggleOpen is a function

The tuple ensures that the first element is always a boolean and the second is always a function — TypeScript enforces this at the call site.

Enums

An Enum (short for "Enumeration") allows you to define a set of named constants. Instead of using "magic strings" or random numbers throughout your code, you can use readable names.

1. Numeric Enums

By default, Enums assign numbers starting from 0. You can change the starting value by explicitly assigning the first member, and the rest will increment from there.

enum Direction {
  Up,     // 0
  Down,   // 1
  Left,   // 2
  Right   // 3
}
let move: Direction = Direction.Left; // Value is 2

// Custom starting value:
enum Priority {
  Low = 1,  // 1
  Medium,   // 2
  High      // 3
}

2. String Enums

In string enums, each member must be initialized with a string literal. These are often easier to debug because the value remains readable in the compiled JavaScript.

enum Status {
  Success = "SUCCESS",
  Failure = "FAILURE",
  Pending = "PENDING"
}
let responseStatus: Status = Status.Success;

3. const enum

TypeScript also provides a const enum variant. Unlike regular enums — which generate a JavaScript object at runtime — a const enum is completely removed during compilation and replaced with the actual values inline. This makes it the more performant option for most use cases.

const enum Direction {
  Up,
  Down,
  Left,
  Right
}

let move = Direction.Left;
// Compiles to: let move = 2;
// No JavaScript object is generated at runtime

Use const enum when you don't need to iterate over the enum values at runtime and simply want the readability benefit without the overhead.

When to Use Which?