Tuple type definition in Typescript

Introduction

A tuple lets you store a fixed number of items with different types together. It helps keep related data organized and clear.

When you want to group a few values of different types, like a name and age.

When a function returns multiple values of different types.

When you want to represent a pair or triple of related data, like coordinates (x, y).

When you want to ensure the order and type of elements in a small collection.

When you want to pass a fixed set of mixed-type values as one variable.

Syntax

Typescript

let variableName: [type1, type2, ...];

The number of types inside the square brackets [] sets the tuple size.

Each position has a fixed type, so order matters.

Examples

This tuple stores a string and a number, like a name and age.

Typescript

let person: [string, number];
person = ["Alice", 30];

This tuple stores two numbers representing coordinates.

Typescript

let point: [number, number];
point = [10, 20];

This tuple stores a status code, message, and success flag.

Typescript

let response: [number, string, boolean];
response = [200, "OK", true];

Sample Program

This program defines a function that returns a tuple with a name and age. It then prints them.

Typescript

function getUserInfo(): [string, number] {
  return ["Bob", 25];
}

const userInfo = getUserInfo();
console.log(`Name: ${userInfo[0]}, Age: ${userInfo[1]}`);

Important Notes

You cannot add or remove elements from a tuple; its size is fixed.

Access tuple elements by their position, like array indexes.

Tuples help catch mistakes by enforcing types and order.

Summary

Tuples store a fixed number of values with specific types in order.

Use tuples to group related but different types of data together.

They help keep your code clear and safe by checking types and positions.

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