JavaScript Array Methods

Array

In simple words, we can say array is a collection of elements or data. An array is a single variable that stores multiple elements in JavaScript. An array is a non-primitive data type. You can store all data types in an array. For example, number, string, boolean, and null. We use [ ] square bracket to declare an array.

We create an array in two ways -

We can create an array using array literal notation.

const arr = ["Rafe", 5, "Abhinav", 6, null, true];

We can create an array using constructor.

const arr = new Array("Rafe", 5, "Abhinav", 6, null, true);

Array Methods

length() -

To find how many elements are in an array we use the length() method.

 let book = ["Math", "English", "Bio", "Physics"];     
 //  Output 4

push() -

With the help of the push() method we can add an element at the end of an Array.

 let book = ["Math", "English", "Bio", "Physics"];
     book.push("Hindi");
  //  ['Math', 'English', 'Bio', 'Physics', 'Hindi']

unshift() -

With the help of the unshift() method, we can add an element at the beginning of an Array.

 let book = ["Math", "English", "Bio", "Physics"];
     book.unshift("Hindi");
  //  ['Hindi', 'Math', 'English', 'Bio', 'Physics']

pop() -

The pop() method removes an element from the last element of an array.

let book = ["Math", "English", "Bio", "Physics"];
     book.pop();
  //  ['Math', 'English', 'Bio']

shift() -

The shift() method removes an element from the start element of an array.

let book = ["Math", "English", "Bio", "Physics"];
     book.shift();
console.log(book);
  //  ['English', 'Bio', 'Physics']

reverse() -

With the help of this method, We can reverse the element of an array.

let book = ["Math", "English", "Bio", "Physics"];
     book.reverse();
  // ['Physics', 'Bio', 'English', 'Math']

indexOf() -

To find the position of any element we use the indexof() method.

let book = ["Math", "English", "Bio", "Physics"];
let position = book.indexOf("Bio");      // 2

sort() -

With this method, We can sort the elements in a specific order (ascending or descending).

let book = ["Math", "English", "Bio", "Physics"];
let sorted = book.sort(); 
   //  ['Bio', 'English', 'Math', 'Physics']
    // changed alphabetically

fill() -

This method returns an array by filling all elements with a specified value.

let book = ["Math", "English", "Bio", "Physics"];
let filled = book.fill("Hindi"); 
// ['Hindi', 'Hindi', 'Hindi', 'Hindi']

map() -

This method creates a new array from the results of calling a function for every element.

let number = [2, 4, 5, 8, 9];
let square = number.map(function (num){
     return num * num
}); 
console.log(square); 
  // [4, 16, 25, 64, 81]

filter() -

This method returns a new array with all elements that comply with the condition by the given function.

let number = [2, 18, 5, 8, 9, 12, 15];
let filtered = number.filter((num) => {
     return num < 10
}); 
console.log(filtered); 
//  [2, 5, 8, 9]

slice() -

The slice() method extracts the part of the given array and add them to the new array. This method doesn't change the original array.

let number = [2, 18, 5, 8, 9, 12, 15];
console.log(number.slice(3,6));
//  [8, 9, 12]

splice() -

With the help of this method, We can add, remove or replace elements in place of an array.

syntax : (index, how many, item1,....., itemN)

// Remove items
const number = [2, 3, 5, 7, 9, 12];
    number.splice(2, 3);      
    console.log(number);
 // [2, 3, 12]

// Add items
const fruits = ["Apple", "Guava", "Papaya", "Banana"];
    fruits.splice(1, 0, "Kiwi");
    console.log(fruits);
 // ['Apple', 'Kiwi', 'Guava', 'Papaya', 'Banana']

// At position 2, Add 2 and Remove 2 elements:
const fruits = ["Apple", "Guava", "Papaya", "Banana"];
    fruits.splice(1, 2, "Kiwi", "Watermelon");
    console.log(fruits);
 // ['Apple', 'Kiwi', 'Watermelon', 'Banana']

some() -

This method checks whether at least one element in the array passes the test implemented by the provided function. If any one element passes the text it returns true otherwise returns false. It doesn't modify the array.

let number = [2, 4, 15, 8, 9];
let check = number.some(function (num){
    return num > 10;
}); 
console.log(check); 
// true

reduce() -

This method executes a reducer function for array element and returns a single value.

const number = [2, 4, 5, 4, 5];
const sum = number.reduce((accumulator, currentValue) => {
    return accumulator + currentValue;
})
console.log(sum);
// 20

concat() -

With the help of the concat() method, We can merge two or more different arrays into a single array.

const num1 = [1, 2, 3, 4];
const num2 = [5, 6, 7, 8];
const merged = num1.concat(num2 + num3);
console.log(merged);
//  [1, 2, 3, 4, 5, 6, 7, 8]

join() -

This method returns an array as a string. It doesn't change the original array.

const vehicles = ["Bike", "Cycle", "Car", "Truck"];
let joined = vehicles.join("-");
console.log(joined);
// Bike-Cycle-Car-Truck
// By default this method put a comma (,) between each element.

includes() -

With this method, You can check if an array contains a specified element or not. It gives output in true or false.

let books = ["Math", "Hindi", "Science", "English"];
let check = books.includes("English");
console.log(check); 
// true

find() & findLast()-

The find() method returns the value of the first array element and the findLast() method returns the value of the last array element that passes the provided test function. It returns undefined if no element passes the test. It doesn't change the original array. We can also find the index of the elements by using the findIndex() and findLastIndex() methods.

let number = [2, 4, 15, 8, 18, 35, 9];
let val1 = number.find(num => num > 10);
let val2 = number.findLast(num => num > 10);
console.log(`find = ${val1} and findLast = ${val2}`);
// Output : find = 15 and findLast = 35 
console.log(number.findIndex(num => num > 10));      // 2
console.log(number.findLastIndex(num => num > 10));  // 5

toString() -

With this method, We can convert the array elements into a string and separate each other by a comma.

let books = ["Math", "Hindi", "Science", "English"];
let changed = books.toString();
console.log(changed); 
// Math,Hindi,Science,English

That's all about array methods, Thanks for reading!