Tuple type definition in Typescript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the output of this tuple length check?

Consider this TypeScript code that defines a tuple and checks its length.
What will be the output when this code runs?

Typescript

const myTuple: [string, number, boolean] = ['hello', 42, true];
console.log(myTuple.length);

A 3

B 2

C Error: Tuple length not accessible

D undefined

💡 Hint

Remember tuples are fixed-length arrays in TypeScript.

The tuple has exactly three elements, so its length property is 3.

❓ Predict Output

intermediate

What is the output when accessing a tuple element?

Given this tuple definition and access, what will be printed?

Typescript

const coords: [number, number] = [10, 20];
console.log(coords[1]);

A undefined

B 10

C 20

D Error: Index out of bounds

💡 Hint

Tuple elements are accessed by zero-based index.

coords[1] accesses the second element, which is 20.

🔧 Debug

advanced

What error does this tuple assignment cause?

This code tries to assign a tuple to a variable. What error will TypeScript report?

Typescript

let user: [string, number];
user = ['Alice', '25'];

A Tuple must have exactly 3 elements.

B No error, assignment is valid.

C Type 'number' is not assignable to type 'string'.

D Type 'string' is not assignable to type 'number'.

💡 Hint

Check the types of each tuple element carefully.

The second element should be a number, but '25' is a string.

📝 Syntax

advanced

Which option correctly defines a tuple type with optional elements?

Which of these tuple type definitions is valid TypeScript syntax for a tuple with an optional boolean as the third element?

A type MyTuple = [string, number?, boolean];

B type MyTuple = [string, number, boolean?];

C type MyTuple = [string?, number, boolean];

D type MyTuple = [string, number, ?boolean];

💡 Hint

Optional elements in tuples use a question mark after the type.

Only option B correctly places the question mark after the type to mark the third element optional.

🚀 Application

expert

What is the type of the variable 'result' after this tuple manipulation?

Given this TypeScript code, what is the type of 'result'?

Typescript

const data: [number, string, boolean] = [1, 'ok', true];
const result = data.slice(0, 2);

A Array<number | string>

B [number, string]

C [number, string, boolean]

D Array<number | string | boolean>

💡 Hint

Array.slice returns a new array, not a tuple.

The slice method returns a normal array with elements of the tuple types included, so the type is Array.

Practice

1. What is a tuple type in TypeScript?

easy

A. A fixed-length array with specific types for each position

B. An array that can only contain numbers

C. A variable-length array with any types

D. A function that returns multiple values

Solution

1. Step 1: Understand tuple definition

   A tuple is an array with fixed length and specific types at each position.

2. Step 2: Compare options

   Only 'A fixed-length array with specific types for each position' matches the tuple definition.

3. Final Answer:

   A fixed-length array with specific types for each position -> Option A

4. Quick Check:

   Tuple = fixed-length, typed array [OK]

Hint: Tuples fix length and types in order [OK]

Common Mistakes:

• Thinking tuples are just any arrays
• Confusing tuples with functions
• Assuming tuples can change length

2. Which of the following is the correct syntax to define a tuple type with a string and a number in TypeScript?

easy

A. let data: string | number;

B. let data: (string, number);

C. let data: {string, number};

D. let data: [string, number];

Solution

1. Step 1: Recall tuple syntax

   Tuples use square brackets with types separated by commas, e.g., [string, number].

2. Step 2: Check options

   Only let data: [string, number]; uses square brackets correctly. Options B and C use wrong symbols, D is a union type.

3. Final Answer:

   let data: [string, number]; -> Option D

4. Quick Check:

   Tuple syntax = square brackets [OK]

Hint: Use square brackets for tuple types [OK]

Common Mistakes:

• Using parentheses instead of brackets
• Using curly braces which define objects
• Confusing union types with tuples

3. What will be the output of this TypeScript code?

let tuple: [string, number] = ['age', 30];
console.log(tuple[0]);
console.log(tuple[1]);

medium

A. undefined and undefined

B. 30 and "age"

C. "age" and 30

D. Error: Type mismatch

Solution

1. Step 1: Understand tuple assignment

   The tuple is assigned ['age', 30], so index 0 is 'age' (string), index 1 is 30 (number).

2. Step 2: Check console.log outputs

   console.log(tuple[0]) prints 'age', console.log(tuple[1]) prints 30.

3. Final Answer:

   "age" and 30 -> Option C

4. Quick Check:

   Tuple values printed in order [OK]

Hint: Tuple indexes match type order [OK]

Common Mistakes:

• Swapping tuple elements order
• Expecting errors on correct assignment
• Confusing tuple with object properties

4. Identify the error in this TypeScript tuple declaration:

let info: [string, number] = [25, 'John'];

medium

A. The tuple elements are in the wrong order

B. Tuple length is incorrect

C. Missing type annotation

D. No error, code is correct

Solution

1. Step 1: Check tuple type order

   The tuple type expects [string, number], so first element must be string, second number.

2. Step 2: Compare assigned values

   The assigned array is [25, 'John'], which is [number, string], reversed order causing type error.

3. Final Answer:

   The tuple elements are in the wrong order -> Option A

4. Quick Check:

   Tuple type order must match values [OK]

Hint: Match tuple types order exactly [OK]

Common Mistakes:

• Swapping values ignoring type order
• Assuming tuple length mismatch
• Forgetting to add type annotation

5. You want to define a tuple type to store a person's name (string), age (number), and a boolean indicating if they are a student. Which is the correct tuple type and example value?

hard

A. let person: [number, string, boolean] = [25, 'Alice', true];

B. let person: [string, number, boolean] = ['Alice', 25, true];

C. let person: [string, boolean, number] = ['Alice', 25, true];

D. let person: [string, number] = ['Alice', true, 25];

Solution

1. Step 1: Define tuple type order

   The tuple should be [string, number, boolean] for name, age, and student status respectively.

2. Step 2: Check example values

   let person: [string, number, boolean] = ['Alice', 25, true]; matches the type order and values: 'Alice' (string), 25 (number), true (boolean).

3. Final Answer:

   let person: [string, number, boolean] = ['Alice', 25, true]; -> Option B

4. Quick Check:

   Tuple type matches value order and types [OK]

Hint: Order types as data appears in tuple [OK]

Common Mistakes:

• Mixing up type order
• Using wrong types for positions
• Incorrect tuple length