Array [] in Typescript
An array is another data type in TypeScript that allows us to store collections of values of the same type. We can define an array using square brackets []
. However, it is also recommended to specify the type of elements that will be stored in the array instead of using any
. This helps avoid ambiguity and facilitates understanding the code by other developers in the future.
Declaring an Array with a Specific Type
To declare an array with a specific type, we can use the syntax let variable: Array<type>
. For example, if we want to create an array of integers, we can do it in the following way:
let numbers: Array<number>;
We can also use the shortened syntax, where the type of the array is specified within square brackets:
let numbers: number[];
In both cases, the variable numbers
will now be an array that can only store integers.
Examples of Using Arrays in Code
Storing a List of Values
Arrays are particularly useful when we want to store a list of values of the same type. For example, we can create an array that contains a list of names:
let names: string[] = ["Alice", "Bob", "Charlie", "David"];
Now, the variable names
contains an array with four names.
Tired of reading? Watch this video to see how Wojtek makes things quick and easy (available in Polish only).
Iterating through Array Elements
To iterate through all elements of an array, we can use a for
loop or the forEach
method.
let numbers: number[] = [1, 2, 3, 4, 5];
// Using a for loop
for (let i = 0; i < numbers.length; i++) {
console.log(numbers[i]);
}
// Using the forEach method
numbers.forEach((num) => {
console.log(num);
});
Both methods will print the values of the numbers
array, which are numbers from 1 to 5.
Adding and Removing Elements
Arrays in TypeScript allow adding and removing elements in a straightforward way.
let fruits: string[] = ["apple", "banana", "orange"];
// Adding a new fruit to the end of the array
fruits.push("grape");
// Removing the last fruit from the array
fruits.pop();
// Adding a new fruit to the beginning of the array
fruits.unshift("pear");
// Removing the first fruit from the array
fruits.shift();
After executing the above operations, the fruits
array will contain three elements: "banana", "orange", and "grape".
Searching for Elements
We can also search for the index of a specific value in the array.
let numbers: number[] = [10, 20, 30, 40, 50];
// Searching for the index of the number 30
let index = numbers.indexOf(30);
console.log(index); // Output: 2
The indexOf
method will return the index of the first occurrence of the number 30 in the numbers
array.
Why is it not worth using arrays of type any?
The any
type removes static typing, which can lead to errors and security issues. Instead, it is advisable to precisely specify the data type stored in the array, allowing TypeScript to detect type errors during compilation. This makes the code more efficient, secure, and understandable for other developers.
Summary
Arrays are valuable tools in TypeScript that allow storing collections of values of the same type. By precisely specifying the type of the array, we can avoid errors and make the code more understandable for other developers. Knowing how to effectively use arrays enables us to manipulate data easily and perform various operations on collections of values in our programs.