Array's methods

Array has more than 30+ Instance methods. On this blog we are going to learn 10 array’s Instance methods.

1. concat()

If you want to merge two or more array then you can use this method. This method return a new array.

Example:

const array1 = ["1", "2", "3"];
const array2 = ["4", "5", "6"]; 

const array3 = array1.concat(array2);
console.log(array3); 
// array3 = ["1", "2", "3","4", "5", "6"]

2.filter()

This method creates a shallow copy of an array. It returns a new array with the elements that pass the test or condition.

Example:

const superHero = ["Ironman", "Thor", "Black-widow", "Hulk", "Sentry"];

const result = superHero.filter( item => item.length > 4);

console.log(result);

// const superHero = ["Ironman", "Black-widow", "Sentry"];

3.flat()

This method helps you to create a new array with all sub-array elements concatenated into it repetitively up to the specified depth

const arr1 = [0, 1, 2, [3, 4]];

console.log(arr1.flat());
// expected output: Array [0, 1, 2, 3, 4]

const arr2 = [0, 1, [2, [3, [4, 5]]]];

console.log(arr2.flat());
// expected output: Array [0, 1, 2, Array [3, Array [4, 5]]]

console.log(arr2.flat(2));
// expected output: Array [0, 1, 2, 3, Array [4, 5]]

console.log(arr2.flat(Infinity));
// expected output: Array [0, 1, 2, 3, 4, 5]

4.indexOf()

You can use this method to find the index of given element. But you will get the first index which can satisfy the condition. If it does get the element then it returns -1.

Example:

const beasts = ["ant", "bison", "camel", "duck", "bison"];

console.log(beasts.indexOf("bison"));
// Expected output: 1

// Start from index 2
console.log(beasts.indexOf("bison", 2));
// Expected output: 4

console.log(beasts.indexOf("giraffe"));
// Expected output: -1

5.join()

This method help us to a new string by concatenating all of the elements in this array. Initially it returns with commas but you can add your desired separator like “-“ .

Example:

const elements = ["Fire", "Air", "Water"];

console.log(elements.join());
// Expected output: "Fire,Air,Water"

console.log(elements.join(""));
// Expected output: "FireAirWater"

console.log(elements.join("-"));
// Expected output: "Fire-Air-Water"

6. reduceRight()

The reduceRight() method reduces the array to a single value by executing a callback function on two values of the array (from right to left). InitialValue (optional) - A value that will be passed to callback function on the first call. If not provided, the last element acts as the accumulator on the first call.

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

// function that adds last two values of the numbers array
function sum_reducer(accumulator, currentValue) {
  return accumulator + currentValue;
}

// returns a single value after reducing the numbers array
let sum = numbers.reduceRight(sum_reducer);

console.log(sum);

// Output: 10

7.splice()

You can use this method to change the contents of an array by removing or replacing existing elements and/or adding new elements.

Example:

const months = ["Jan", "March", "April", "June"];
months.splice(1, 0, "Feb");
// Inserts at index 1
console.log(months);
// Expected output: Array ["Jan", "Feb", "March", "April", "June"]

months.splice(4, 1, "May");
// Replaces 1 element at index 4
console.log(months);
// Expected output: Array ["Jan", "Feb", "March", "April", "May"]

8.with()

This method returns a new array with the element at the given index replaced with the given value.

Example:

const arr = [1, 2, 3, 4, 5];
// 2 is an index
console.log(arr.with(2, 6)); // [1, 2, 6, 4, 5]
console.log(arr); // [1, 2, 3, 4, 5]

9.toSorted()

This is a copy method of sort(). It returns a new array with the element sorted in ASC order.

Example:

const months = ["Mar", "Jan", "Feb", "Dec"];
const sortedMonths = months.toSorted();
console.log(sortedMonths); // ['Dec', 'Feb', 'Jan', 'Mar']
console.log(months); // ['Mar', 'Jan', 'Feb', 'Dec']

const values = [1, 10, 21, 2];
const sortedValues = values.toSorted((a, b) => a - b);
console.log(sortedValues); // [1, 2, 10, 21]
console.log(values); // [1, 10, 21, 2]

10.slice()

This method returns shallow copy of existing array as a new array. Just we need to define the start and end with index.

Example:

const animals = ["ant", "bison", "camel", "duck", "elephant"];

console.log(animals.slice(2));
// Expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));
// Expected output: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// Expected output: Array ["bison", "camel", "duck", "elephant"]

console.log(animals.slice(-2));
// Expected output: Array ["duck", "elephant"]

console.log(animals.slice(2, -1));
// Expected output: Array ["camel", "duck"]

console.log(animals.slice());
// Expected output: Array ["ant", "bison", "camel", "duck", "elephant"]