What is an Array?

An array is an object in javascript, it helps to store multiple data in a single variable. An array consists of an index and value means the index represents an item’s position. Arrays are resizable and can contain a mix of different data types like this [1, "Pratham", true]. In javascript and generally in other programming languages arrays are zero-indexed which means the first element of an array is at index 0, the second is at index 1, and so on. We can get the value of a particular index of an array like this arr[1] so Let’s see an example:

let arr = ["Pratham", "Sharma", "Milo"];
arr[0] //Pratham

so let’s start our top 5 most underrated methods list:

flat()

The flat() helps to convert a multi-dimensional array into a specified dimensional array and then returns a new array. That was in my words what mdn docs say:

“The **flat()**method creates a new array with all sub-array elements concatenated into it recursively up to the specified depth.”

Example:

const arr = [1, 45, 98, [4, 6, 7]];
console.log(arr.flat()) // [1, 45, 98, 4, 6, 7]

flat() takes one parameter which is depth level specifying how deep a nested array structure should be flattened. Defaults to 1 (Line taken from mdn docs).

Another use of flat() is to remove the empty item from an array like this:

const arr = [75, 987, , 668, 8, 0];
console.log(arr.flat()) //[75, 987, 668, 8, 0]

flat() is supported in all browsers and also in deno and node.js.

More Read:

MDN Docs

GeeksForGeeks

flatMap()

As the name suggests flatMap() is a combination of flat() and map() so this method firstly will map every element with the help of map() and then flattens (by one level) the input array element into a new array.

Example:

const arr = [1, 23, 45, 67, 98];
const newArr = arr.flatMap((x) => [x + 2]);
console.log(newArr) //[3, 25, 47, 69, 100]

More Read:

MDN Docs

GeeksForGeeks

reduce()

The reduce() method executes a reducer function for the array element. This method returns a single value it can be a string or number (mainly a number). Usually, this method uses to calculate the total amount of a cart we see in the example. This method does not change the original array. As the name suggests reduce() method will reduce the array data into a single value.

Parameters

function() which is required and also called the reducer function and initialValue

Reducer function parameters:

total (required), currentValue (required), currentIndex, arr

Example:

const cart = [{name: "item1", price: 199, qty: 2}, {name: "item2", price: 99, qty: 4}, {name: "item3", price: 999, qty: 1},];
const totalPrice = cart.reduce((acc, curr) => acc + curr.price * curr.qty ,0);
console.log(totalPrice); //1793

More Read:

MDN Docs

W3Schools

reduceRight()

The reduceRight() method works the same as reduce() but this method will map the array from the right direction (from right-to-left).

Example:

const array1 = [[0, 1], [2, 3], [4, 5]];
const result = array1.reduceRight((acc, curr) => acc.concat(curr));
console.log(result); //[4, 5, 2, 3, 0, 1]

More Read:

MDN Docs

W3Schools

copyWithin()

The copyWithin() method copies array elements to another position in the array. This method overwrites the existing values and does not add items to the array without modifying its length. This method returns a changed or modified array.

Example:

const name = ["Pratham", "Sharma", "Milo", "Mohan"];
console.log(name.copyWithin(2, 0, 2)); //["Pratham", "Sharma", "Pratham", "Mohan"]

More Read:

MDN Docs

W3Schools

I hope you like reading this article I know you feel that these lines are similar to mdn docs, and w3schools because I learn these methods from these websites and this is my first article I will try to create more interesting articles about javascript and other technologies.