Introduction

The array is widely used and a powerful data structure in all programming languages that support it.

So there are a lot of methods that we implement on an array. For Ex: insertion, deletion, copying, concatenating two arrays, and searching. and for all these operations there are a lot of methods available in JavaScript.

Now let's understand them one by one, but before that let's create an array.

Creating an array

• Let's start by creating an empty array.

let colors = ["Red", "Green", "Blue", "Yellow", "Orange"];

This is how we create an array, now let's go ahead and put up some more values in it.

Inserting Elements

• push() –– method is used to insert an element into an array. The push() method is used to add an element at the end of an array.

let colors = ["Red", "Green", "Blue", "Yellow", "Orange"];

colors.push("Black");

console.log(colors);
// ["Red", "Green", "Blue", "Yellow", "Orange", "Black"]

• unshift() –– method is used to insert an element at the very beginning of an array.

let colors = ["Red", "Green", "Blue", "Yellow", "Orange"];

colors.unshift("Black");

console.log(colors);
// ["Black", "Red", "Green", "Blue", "Yellow", "Orange"]

Note: – unshift() adds elements at the beginning of an array, and the opposite of it is push() adds elements at the end of an array.

Deleting Elements

• pop() –– method is used to remove a single element from an array. It removes an element from the end of the array and then it returns the removed element.

let avengers = ["Iron Man", "Thor", "Captain America", "Hulk"];

avengers.pop(); // Hulk

console.log(avengers);
// ["Iron Man", "Thor", "Captain America"]

• shift() –– method removes an element from the beginning of an array. Like the pop() method, shift() returns the removed element

let avengers = ["Iron Man", "Thor", "Captain America", "Hulk"];

avengers.shift(); // Iron Man

console.log(avengers);
// ["Thor", "Captain America", "Hulk"]

Array Iteration

• foreach() –– method iterates over all elements and implements a given function on each element. It is very often used when an operation has to be performed on each element of the array.

let states = ["Maharashtra", "Gujarat", "Rajasthan", "Punjab", "Uttar Pradesh"];

// (state) => console.log(state) –– this is an arrow function which
// prints every state present in the array

states.foreach((state) => console.log(state));

// Maharashtra
// Gujarat
// Rajasthan
// Punjab
// Uttar Pradesh

Copping Array

• slice() –– method doesn't change the original array. Instead, it creates a new shallow copy of the original array. slice() method slices out a piece of an array into a new array.

let statesList = ["Maharashtra", "Gujarat", "Rajasthan", "Punjab", "Uttar Pradesh"];

let statesList2 = statesList.slice(); 
// created copy of statesList as statesList2

console.log(statesList);
// ["Maharashtra", "Gujarat", "Rajasthan", "Punjab", "Uttar Pradesh"]

let sortedStates = statesList.slice(1, 3);
// slice(start, up to)

console.log(sortedStates);
// ["Gujarat", "Rajasthan"]

Note ––

• The slice() method can take two arguments like slice(1, 3).

• The method then selects elements from the start argument, and up to (but not including) the end argument.

Concatenating Arrays

• concat() –– method creates a new array by merging(concatenating) one or more arrays.

let first = [1, 2, 3, 4];

let second = [5, 6, 7, 8];

let merged = first.concat(second);

 console.log(merged);
 console.log(first);
 console.log(second);

// [1, 2, 3, 4, 5, 6, 7, 8]
// [1, 2, 3, 4]
// [5, 6, 7, 8]

Searching in Array

• indexOf() –– method returns the position of the first occurrence of a value in a string, and if it returns -1 if the value is not found.

let numbers = ["uno", "dos", "tres", "cuatro"];

console.log(numbers.indexOf("uno"));
console.log(numbers.indexOf("tres"));
console.log(numbers.indexOf("cinco"));

// 0
// 2
// -1

Array Transformation

• map() –– method creates a new array by iterating through the elements and applying the logic we provided in the function as an argument.

let names = ["Superman", "Batman", "Aquaman"];

names.map((name)=> console.log('I am', name));
// I am Superman
// I am Batman
// I am Aquaman

Hope you enjoyed reading this article

we have reached the end of this JavaScript array methods. We covered the commonly used methods for performing operations such as insertion, deletion, copying, concatenation, searching, and transformation.