Array In TypeScript

In TypeScript, Arrays are used to store and manipulate collections of values.

TypeScript provides static typing, allowing us to define the type of elements that an array can contain.

Array Declaration:

We can declare an array using the square bracket notation.

Example:

let numbers: number[] = [1, 2, 3, 4, 5, 6, 7];

let colours: string[] = ["red", "purple", "orange", "green", "gray"];

let images: {height: number, width: number }[] = [ {height: 200, width: 100} ]

let mixedArray: (string | number | {height: number, width: number })[] = 
     ["red", 5, "orange", {height: 200, width: 100}];

Array Initialization:

Example:

let numbers: Array<number> = new Array<number>(1, 2, 3, 4, 5, 6, 7);

Arrays can be initialized using the new keyword.

Example:

let numbers: number[] = [1, 2, 3, 4, 5, 6, 7];
let colours: string[] = ["red", "purple", "orange", "green", "gray"];

let fifthNumber: number = numbers[4];  // 5
let fifthFruit: string = colours[4];   // "gray"

Accessing Array Elements:

Array elements can be accessed using their index.

Array Methods:

Arrays in TypeScript come with various built-in methods for common operations.

push and pop:

let colours: string[] = ["red", "purple", "orange", "green", "gray"];

colours.push("yellow");  // adds an element to the end
// Output: ["red", "purple", "orange", "green", "gray", "yellow"]

let lastColour: string = colours.pop();  // removes and returns the last element
// Output: ["red", "purple", "orange", "green", "gray"]

shift and unshift:

Example:

let colours: string[] = ["red", "purple", "orange", "green", "gray"];
colours.splice(1, 1, "blue", "dark cyan");  // removes 1 element at index 1 and adds "blue" and "dark cyan".

Example:

let colours: string[] = ["red", "purple", "orange", "green", "gray"];

colours.unshift("white");  // adds an element to the beginning
// Output: ["white", "red", "purple", "orange", "green", "gray"];

let firstColour: string = colours.shift();  // removes and returns the first element
// console.log(firstColour) // Output: white
// console.log(colours) // Output: ["red", "purple", "orange", "green", "gray"];

splice:

Example:

let colours: string[] = ["red", "purple", "orange", "green", "gray", "blue", "dark cyan"];
let slicedColours: string[] = colours.slice(1, 5);  // creates a new array with elements from index 1 to 4

The "splice()" method is used to change the contents of an array by removing or replacing existing elements and adding new elements in place. Unlike the "slice()" method, splice() modifies the original array.

slice:

Example:

let someValues: any[] = [1, 2, false, "ten", "24/7", true];
let onlyNumbers: number[] = someValues.filter(value => typeof value === "number") as number[];

console.log(onlyNumbers) // [1, 2]

The "slice()" method is used to extract a section of an array and return a new array containing the extracted elements. It does not modify the original array.

The slice() method takes two parameters: the starting index (inclusive) and the ending index (exclusive) of the section to be extracted. If no second parameter is provided, it extracts all elements from the starting index to the end of the array.

Example:

let colours: string[] = ["red", "purple", "orange", "green", "gray", "blue", "dark cyan"];
let [first, second, ...rest] = fruits;

console.log(first);  // "red"
console.log(second); // "purple"
console.log(rest);   // ["orange", "green", "gray", "blue", "dark cyan"]]

Array Type Assertions:

If TypeScript cannot infer the correct type, we can use type assertions.

Array Destructuring:

Destructuring allows us to unpack values from an array.

<-- Operators

Tuples -->

Array In TypeScript

In TypeScript, Arrays are used to store and manipulate collections of values.

TypeScript provides static typing, allowing us to define the type of elements that an array can contain.

Array Declaration:

We can declare an array using the square bracket notation.

Example:

let numbers: number[] = [1, 2, 3, 4, 5, 6, 7];

let colours: string[] = ["red", "purple", "orange", "green", "gray"];

let images: {height: number, width: number }[] = [ {height: 200, width: 100} ]

let mixedArray: (string | number | {height: number, width: number })[] = 
     ["red", 5, "orange", {height: 200, width: 100}];

Array Initialization:

Example:

let numbers: Array<number> = new Array<number>(1, 2, 3, 4, 5, 6, 7);

Arrays can be initialized using the new keyword.

Example:

let numbers: number[] = [1, 2, 3, 4, 5, 6, 7];
let colours: string[] = ["red", "purple", "orange", "green", "gray"];

let fifthNumber: number = numbers[4];  // 5
let fifthFruit: string = colours[4];   // "gray"

Accessing Array Elements:

Array elements can be accessed using their index.

Array Methods:

Arrays in TypeScript come with various built-in methods for common operations.

push and pop:

let colours: string[] = ["red", "purple", "orange", "green", "gray"];

colours.push("yellow");  // adds an element to the end
// Output: ["red", "purple", "orange", "green", "gray", "yellow"]

let lastColour: string = colours.pop();  // removes and returns the last element
// Output: ["red", "purple", "orange", "green", "gray"]

shift and unshift:

Example:

let colours: string[] = ["red", "purple", "orange", "green", "gray"];
colours.splice(1, 1, "blue", "dark cyan");  // removes 1 element at index 1 and adds "blue" and "dark cyan".

Example:

let colours: string[] = ["red", "purple", "orange", "green", "gray"];

colours.unshift("white");  // adds an element to the beginning
// Output: ["white", "red", "purple", "orange", "green", "gray"];

let firstColour: string = colours.shift();  // removes and returns the first element
// console.log(firstColour) // Output: white
// console.log(colours) // Output: ["red", "purple", "orange", "green", "gray"];

splice:

Example:

let colours: string[] = ["red", "purple", "orange", "green", "gray", "blue", "dark cyan"];
let slicedColours: string[] = colours.slice(1, 5);  // creates a new array with elements from index 1 to 4

slice:

Example:

let someValues: any[] = [1, 2, false, "ten", "24/7", true];
let onlyNumbers: number[] = someValues.filter(value => typeof value === "number") as number[];

console.log(onlyNumbers) // [1, 2]

The "slice()" method is used to extract a section of an array and return a new array containing the extracted elements. It does not modify the original array.

Example:

let colours: string[] = ["red", "purple", "orange", "green", "gray", "blue", "dark cyan"];
let [first, second, ...rest] = fruits;

console.log(first);  // "red"
console.log(second); // "purple"
console.log(rest);   // ["orange", "green", "gray", "blue", "dark cyan"]]

Array Type Assertions:

If TypeScript cannot infer the correct type, we can use type assertions.

Array Destructuring:

Destructuring allows us to unpack values from an array.

<-- Operators

Tuples -->