Tuple with fixed length and types in Typescript

Introduction

A tuple lets you store a fixed number of values, each with a specific type. It helps keep data organized and safe.

When you want to group a few related values of different types together, like a person's name and age.

When you need to return multiple values from a function with known types and order.

When you want to represent a fixed structure, like a coordinate with x and y numbers.

When you want to ensure the data always has the same length and types in the same order.

Syntax

Typescript

let variableName: [type1, type2, type3];

// Example:
let person: [string, number];

Each position in the tuple has a fixed type.

The length of the tuple is fixed by the number of types you list.

Examples

A tuple with two numbers representing a point's x and y coordinates.

Typescript

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

A tuple with a string, number, and boolean for a user's name, age, and active status.

Typescript

let user: [string, number, boolean];
user = ['Alice', 30, true];

A tuple with zero elements, always empty.

Typescript

let emptyTuple: [];
emptyTuple = [];

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: [string, number] = getUserInfo();
console.log(`Name: ${userInfo[0]}, Age: ${userInfo[1]}`);

Important Notes

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

Access tuple elements by their position, starting at 0.

TypeScript will check the types and order to prevent mistakes.

Summary

Tuples store a fixed number of values with specific types.

They help keep related data organized and type-safe.

Use tuples when you know the exact number and types of elements.

Practice

1. What is a tuple in TypeScript?

easy

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

B. A variable-length array with any types

C. A function that returns multiple values

D. A type of object with dynamic keys

Solution

1. Step 1: Understand tuple definition

   A tuple is an array with a fixed number of elements where each element has a specific type.

2. Step 2: Compare with other options

   Options A, B, and C describe other concepts like objects, variable arrays, or functions, not tuples.

3. Final Answer:

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

4. Quick Check:

   Tuple = fixed length + specific types [OK]

Hint: Remember: tuple = fixed length + fixed types [OK]

Common Mistakes:

• Thinking tuples can have variable length
• Confusing tuples with regular arrays
• Assuming tuples are objects

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

easy

A. let tuple: [string; number] = ['hello', 5];

B. let tuple: (string, number) = ['hello', 5];

C. let tuple: {string, number} = ['hello', 5];

D. let tuple: [string, number] = ['hello', 5];

Solution

1. Step 1: Recall tuple syntax

   Tuples use square brackets with types separated by commas: [type1, type2].

2. Step 2: Check each option

   let tuple: [string, number] = ['hello', 5]; uses correct syntax. Options B, C, and D use invalid tuple syntax.

3. Final Answer:

   let tuple: [string, number] = ['hello', 5]; -> Option D

4. Quick Check:

   Tuple syntax = square brackets with comma-separated types [OK]

Hint: Use square brackets with commas for tuple types [OK]

Common Mistakes:

• Using parentheses instead of brackets
• Using curly braces instead of brackets
• Using semicolons instead of commas

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

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

medium

A. 30\nage

B. undefined\nundefined

C. age\n30

D. Error: Type mismatch

Solution

1. Step 1: Understand tuple assignment

   The tuple 'data' is assigned ['age', 30], so data[0] is 'age' and data[1] is 30.

2. Step 2: Check console.log outputs

   console.log(data[0]) prints 'age', console.log(data[1]) prints 30, so output is two lines: 'age' then '30'.

3. Final Answer:

   age 30 -> Option C

4. Quick Check:

   Tuple elements print in order: string then number [OK]

Hint: Tuple elements print in order by index [OK]

Common Mistakes:

• Swapping the order of elements
• Expecting an error due to types
• Confusing tuple with object properties

4. Identify the error in this TypeScript tuple declaration:

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

medium

A. The second element should be a number, not a string

B. The tuple length is incorrect

C. The first element should be a number

D. No error, this is valid

Solution

1. Step 1: Check tuple types

   The tuple expects [string, number], so first element string 'John' is correct, second element must be a number.

2. Step 2: Identify type mismatch

   The second element is '25' (a string), which mismatches the expected number type.

3. Final Answer:

   The second element should be a number, not a string -> Option A

4. Quick Check:

   Tuple types must match exactly [OK]

Hint: Check each tuple element type carefully [OK]

Common Mistakes:

• Ignoring type mismatch in tuple elements
• Assuming string '25' is a number
• Thinking tuple length is wrong

5. Given the tuple type [string, number, boolean], which of the following assignments is valid in TypeScript?

hard

A. let t: [string, number, boolean] = ['hello', true, 42];

B. let t: [string, number, boolean] = ['hello', 42, true];

C. let t: [string, number, boolean] = ['hello', 42];

D. let t: [string, number, boolean] = ['hello', 42, 'true'];

Solution

1. Step 1: Check tuple length and types

   The tuple requires exactly three elements: string, number, boolean in that order.

2. Step 2: Evaluate each option

   let t: [string, number, boolean] = ['hello', 42, true]; matches all types and length correctly. let t: [string, number, boolean] = ['hello', true, 42]; swaps number and boolean types. let t: [string, number, boolean] = ['hello', 42]; misses the third element. let t: [string, number, boolean] = ['hello', 42, 'true']; uses a string instead of boolean.

3. Final Answer:

   let t: [string, number, boolean] = ['hello', 42, true]; -> Option B

4. Quick Check:

   Tuple must match length and types exactly [OK]

Hint: Match tuple length and types exactly in order [OK]

Common Mistakes:

• Changing order of types
• Omitting elements
• Using wrong types for elements