Rest elements in tuples in Typescript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of tuple with rest element in function parameter

What is the output of this TypeScript code when calling logTuple([1, 2, 3, 4])?

Typescript

function logTuple([first, ...rest]: [number, ...number[]]) {
  console.log(first, rest.length);
}
logTuple([1, 2, 3, 4]);

A 1 3

B 1 4

C 1 0

D Error: Tuple destructuring failed

💡 Hint

Remember that the rest element collects all remaining items after the first.

The first element is 1, and the rest collects [2, 3, 4], so rest.length is 3.

❓ Predict Output

intermediate

Length of tuple with rest element

What is the length of the tuple type T = [string, ...number[]] when assigned const x: T = ['hello', 1, 2, 3]?

Typescript

type T = [string, ...number[]];
const x: T = ['hello', 1, 2, 3];
console.log(x.length);

A Error: Tuple length cannot be determined

B 3

C 1

D 4

💡 Hint

The rest element allows any number of elements after the first.

The tuple has one string followed by any number of numbers, so length is 4 here.

🔧 Debug

advanced

Identify the error with rest element in tuple type

Why does this TypeScript code cause an error?

Typescript

type T = [...number[], string];
const x: T = [1, 2, 3, 'end'];

A Cannot mix number and string in tuple

B Tuple cannot have more than 3 elements

C Rest element must be last in tuple type

D No error, code is valid

💡 Hint

Check the position of the rest element in the tuple type.

In TypeScript, rest elements in tuple types must be last. Here, the rest is first, causing an error.

🚀 Application

advanced

Function parameter with tuple rest element

Which function signature correctly accepts a tuple with a string followed by any number of booleans?

A function f([name, ...flags]: [string, ...boolean[]]) {}

B function f([name, ...flags]: [...boolean[], string]) {}

C function f([name, ...flags]: [string, boolean]) {}

D function f([name, ...flags]: [boolean, ...string[]]) {}

💡 Hint

Rest element must be last and match the type of remaining elements.

Option A correctly defines a tuple with a string first and any number of booleans after.

🧠 Conceptual

expert

Rest elements and tuple inference behavior

Given const t = [1, 2, 3] as const; and type T = [number, ...number[]];, what is the inferred type of t and does it satisfy T?

Typescript

const t = [1, 2, 3] as const;
type T = [number, ...number[]];

A <code>t</code> is readonly [1, 2, 3] but does not satisfy <code>T</code>

B <code>t</code> is readonly [1, 2, 3] and satisfies <code>T</code>

C <code>t</code> is mutable number[] and satisfies <code>T</code>

D <code>t</code> is mutable number[] but does not satisfy <code>T</code>

💡 Hint

Consider how as const affects tuple types and readonly status.

The as const makes t a readonly tuple [1, 2, 3], which matches the pattern [number, ...number[]].