Mastering JavaScript Array: Discussion on methods of array

Rojesh ShresthaRojesh Shrestha
3 min read

Array is a fundamental data structure used to store data of the same datatype under the same variable name. But JavaScript allows more flexibility compared to some other languages. Example of an array with different data types in JavaScript:

const mixedArray = [1, ‘Hello’, true, {key : ‘value}, [1,2,3]];

Array provides various methods for manipulating and interacting with their elements. Some of the methods of arrays are map(), filter(), reverse(), find(), join(), reduce(), flatMap(). In this blog post, we’ll explore these essential array methods that can elevate your JavaScript skills to new heights.

  1. ‘map()’ : Transforming each elements

Map method is used to transform each and every element of the array and create a new array as a resulting array. We can apply mathematical operations like multiplication, division or power of each element and then store the result in a new array.

  1. 'filter()’ : Filter elements from the array

Filter method is used to filter elements from the array and place the resulting elements in a new array based on the specific condition.

In this example, from array1, we filtered and extracted only odd numbers then stored them in array 2 using filter() method.

  1. ‘find()’ : Locate an element from the array

Find method is used to search through the entire array and then retrieves the very first element that matches the specified condition. This method is similar to filter but filter extracts all elements matching the condition but extracts only one element that matches the condition.

  1. ‘reverse()’ : Flipping the array

Reverse method is used to reverse the order of an array.

  1. ‘join()’ : Array to String

Join method is used to concatenate the elements of an array into a single string using delimiter.

Here the array is joined to form a string separated by space” ”.

  1. ‘flatMap()’ : Combining ‘map’ and ‘flat’

flatMap is a combination of ‘map’ and ‘filter’. This method transforms every elements of array just like the map() method does, plus, it flattens the array and the resulting array into a single array.

  1. ‘reduce()’ :

Basically, reduce function can be used to reduce the array into a single value. It can also be used to reduce two arrays into one. The reduce() does not change the original array. This method does not execute the function for an empty array. The reduce function takes an initialized value or also known as accumulator, if the user does not initialize it to any value, default value is 0. And then takes elements of array and performs function.

Here we initialized the value of the accumulator to 0 then by using loop, we put each element of array into the currentValue variable then added it to the accumulator value. This loop runs for the length of the array.

0
Subscribe to my newsletter

Read articles from Rojesh Shrestha directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Rojesh Shrestha
Rojesh Shrestha