Step 6 – Array and tuple types in TypeScript

Array Types

In TypeScript, an array is a special type of object that stores a collection of values of the same type. To create an array type, you can use the following syntax:

let myArray: number[]; // declare an array of numbers

Here, number[] is the type of the myArray variable. It specifies that myArray is an array that contains only numbers.

To assign values to an array, you can use the following syntax:

let myArray: number[] = [1, 2, 3, 4, 5]; // create an array of numbers

Here, we have created an array of numbers and assigned it to the myArray variable.

You can also declare an array type using the Array keyword. For example:

let myArray: Array<number>; // declare an array of numbers using Array keyword

You can also use generics to define an array type:

let myArray: Array<string> = ['foo', 'bar', 'baz']; // create an array of strings

Accessing Array Elements

You can access an element in an array using its index. The index of the first element in an array is 0, and the index of the last element is array.length - 1. Here’s an example:

let myArray: number[] = [1, 2, 3, 4, 5];
console.log(myArray[0]); // output: 1
console.log(myArray[4]); // output: 5

Iterating Over Arrays

You can use a for loop or a forEach loop to iterate over an array. Here’s an example:

let myArray: number[] = [1, 2, 3, 4, 5];
for (let i = 0; i < myArray.length; i++) {
  console.log(myArray[i]);
}

myArray.forEach(element => {
  console.log(element);
});

Adding Elements to Arrays

You can add elements to an array using the push() method or the concat() method. Here’s an example:

let myArray: number[] = [1, 2, 3, 4, 5];
myArray.push(6); // add 6 to the end of the array
console.log(myArray); // output: [1, 2, 3, 4, 5, 6]

let newArray: number[] = myArray.concat([7, 8, 9]); // concatenate two arrays
console.log(newArray); // output: [1, 2, 3, 4, 5, 6, 7, 8, 9]

Removing Elements from Arrays

You can remove elements from an array using the pop() method or the splice() method. Here’s an example:

let myArray: number[] = [1, 2, 3, 4, 5];
myArray.pop(); // remove the last element from the array
console.log(myArray); // output: [1, 2, 3, 4]

myArray.splice(2, 1); // remove one element from the array starting at index 2
console.log(myArray); // output: [1, 2, 4]

Tuple Types

A tuple is a type of array where the elements have a specific order and type. To create a

tuple type, you can use the following syntax:

let myTuple: [number, string]; // declare a tuple with a number and a string

Here, myTuple is a tuple that contains a number and a string.

To assign values to a tuple, you can use the following syntax:

let myTuple: [number, string] = [1, 'hello']; // create a tuple with a number and a string

Here, we have created a tuple with a number and a string and assigned it to the myTuple variable.

Accessing Tuple Elements

You can access an element in a tuple using its index, just like with an array. Here’s an example:

let myTuple: [number, string] = [1, 'hello'];
console.log(myTuple[0]); // output: 1
console.log(myTuple[1]); // output: 'hello'

Updating Tuple Elements

You can update an element in a tuple using its index, just like with an array. Here’s an example:

let myTuple: [number, string] = [1, 'hello'];
myTuple[0] = 2;
console.log(myTuple); // output: [2, 'hello']

Adding and Removing Elements from Tuples

Unlike with arrays, you cannot add or remove elements from a tuple. Once a tuple is created, its size and types are fixed.

Tuple vs. Array Types

The main difference between a tuple and an array is that a tuple has a fixed length and each element can have a different type, while an array can have a variable length and each element must have the same type. Here’s an example:

let myTuple: [number, string] = [1, 'hello'];
let myArray: number[] = [1, 2, 3, 4, 5];

myTuple[2] = true; // Error: Property '2' does not exist on type '[number, string]'

myArray.push('hello'); // Error: Argument of type '"hello"' is not assignable to parameter of type 'number'

In the example above, we are trying to add a boolean value to a tuple, which is not allowed because the tuple only has two elements. We are also trying to add a string value to an array of numbers, which is not allowed because the array must only contain numbers.

Here’s a diagram to illustrate the difference between tuples and arrays:

Tuple:   [ 1,  'hello' ]
          ^      ^
          |      |
          0      1

Array:   [ 1, 2, 3, 4, 5 ]
          ^           ^
          |           |
          0           4

In the tuple, each element is assigned a specific index that corresponds to its type. In the array, each element is assigned a specific index that corresponds to its position in the array.

Advertisement

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.