Array Methods: You must Know

Hello readers...

Welcome to another blog. This blog is part of the previous blog, where we discussed the basics of arrays. If you have read that blog yet, here you can read that: Arrays Basics

In this blog, I'm going to cover the methods of arrays. These methods are very important and make the JS array powerful.

These methods will allow you to transform, filter, search, and manipulate data with very little code.

Let's start

1. Push()

The push method is used to insert elements at the end of an array. You can pass multiple elements at a time.

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

//push 5 & 6
arr.push(5,6)

//print the array
console.log(arr)

1. POP()

The pop method is used to extract the last element of the array. It returns the poped (last) element of the array

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

let poppedValue = arr.pop();

console.log("Popped Value: ", poppedValue)
console.log("array: ", arr)

1. shift() & unshift

shift and unshift also work like push and pop, but they insert or pop the element from the start (index 0).

These are called shift and unshift because, due to these operations, all the values of the array shift.

Shift: Returns the first element of the array and remove that from the array. The rest of the elements are shifted to index 0

let arr = [1,2,3,4,5];

let shiftedElement = arr.shift();

console.log("Shifted Value: ", shiftedElement)
console.log("array: ", arr)

unshift: It inserts the element at the 0th index and shifts the rest of the elements from 0.

let arr = [1,2,3];

arr.unshift(-1,0);

console.log("array: ", arr)

1. Map()

Map is one of the most used methods of array. It transforms each element of your array and returns the array with transformed elements.

How does it work?

1. First, it calculates the length of the array.

2. It takes a callback function where you write the logic of the value transformation

3. It iterates through each element of the array and transforms those values according to the callback function.

4. At the end, it returns the new transformed array.

syntax:

array.map(() => ())

Example:

let arr = [10, 20, 30, 3, 5]
let newArray = arr.map((v) => v*2);
console.log(newArray)

Note:

1. Map always returns the array with the same length as the original array

2. In the example, there is only one statement, so no need to wrap it under the curly braces. You can wrap, but if you wrap, then you have to write a return statement to return the value.

5. Filter()

Filter also returns an array and takes a callback function, but it returns only those values that satisfy the condition you passed in the callback function.

It filters the array values based on the condition you pass.

let arr = [10, 20, 9,  30, 3, 5]
console.log("Original Array: ", arr)

let filteredArray = arr.filter((v) => v%5 === 0);

//returns an array with elements which are divisible by 5
console.log("transformed array",filteredArray)

6. Reduce()

Reduce function is one of the powerfull method of an array. It reduces the array into a single value.

It takes a callback function with an argument:

1. accumulator: the result value (it can be any data type)

2. iterator: current value (in each iteration)

let arr = [1,2,3,4,5]
console.log("Original Array: ", arr)

let sum = arr.reduce((acc, iterator) => acc+iterator, 0);

//sum of each element
console.log("sum: ", sum)

7. ForEach()

For each method is another way to iterate over an array. It go though through each element of the array and performs the task you pass as a callback function.

This is a forEach loop, which means you can't use break or continue. It must iterate through each element of the array.

It doesn't return any value.

let arr = [1,2,3,4,5]
console.log("Original Array: ", arr)

arr.forEach((element) => console.log(element * 2));

In the above example, I have printed each element twice.

Final Thoughts

JavaScript arrays are much more powerful than simple data containers.

Once you master methods like:

• map()

• filter()

• reduce()

You will write cleaner, shorter, and more expressive code.

These methods are also heavily used in React, Node.js, and modern JavaScript development.

So mastering them is not optional — it’s essential.

That's it for this blog. I hope this helped you understand how powerful JavaScript array methods are and how they can make your code cleaner and easier to write.

Instead of writing long loops for everything, methods like map(), filter(), and reduce() allow us to work with arrays in a much more expressive and modern way. These methods are heavily used in real-world JavaScript applications, especially in frameworks like React.

If you enjoyed this blog and found it helpful, do share it with others and let me know your feedback.

In the next blog, we will dive into one of the most important concepts in JavaScript — Functions. We'll explore how functions work, why they are so powerful, and how they help us write reusable and organized code.

See you in the next one 🚀