Blog

You can modify all array elements in JavaScript by using any of the following methods –

1. Use the map() method to iterate over all array elements and modify them accordingly.
2. Use the forEach() method to iterate over all array elements and modify them accordingly.
3. Use the for loop to iterate over all array elements and modify them accordingly.

Let’s look at each of the above methods in detail below.

Modify All Array Elements In JavaScript

Modifying All Array Elements Using map() Method

The map() method is used to iterate over all array elements and modify them according to the function passed as its argument. This function takes in the current element being processed as an argument and returns the modified value. Consider the following example –

var arr = [‘a’, ‘b’, ‘c’, ‘d’];

var modifiedArr = arr.map(function(ele, index){

   return ele.toUpperCase();

});

console.log(modifiedArr); //["A", "B", "C", "D"]

In the above example, we have created an array arr with four string elements – a, b, c, and d. We have then used the map() method to iterate over all the elements of this array and convert them to uppercase.

Note that the map() method doesn’t modify the original array. It returns a new array with the modified values.

Modifying All Array Elements Using forEach() Method

The forEach() method is also used to iterate over all array elements and modify them according to the function passed as its argument. This function takes in the current element being processed, its index, and the original array as arguments and doesn’t return anything. Consider the following example –

var arr = [‘a’, ‘b’, ‘c’, ‘d’];

var modifiedArr = [];

arr.forEach(function(ele, index){

   modifiedArr.push(element+index);

});

console.log(modifiedArr); //["a0", "b1", "c2", "d3"]

In the above example, we have created an array arr with four string elements – a, b, c, and d. We have then used the forEach() method to iterate over all the elements of this array and concatenate each element with its index. We are storing the modified values in another array modifiedArr which is being returned at the end.

Modifying All Array Elements Using for Loop

We can also use the for loop to iterate over all array elements and perform modification accordingly. Consider the following example –

var arr = [‘a’, ‘b’, ‘c’, ‘d’];

var arr1 = [];

for(var i=0; i<arr.length; i++){

   arr1.push(arr[i]+i);

}

console.log(arr1); //["a0", "b1", "c2", "d3"]

In the above example, we have again created an array arr with four string elements – a, b, c, and d. We have then used the for loop to iterate over all the elements of this array and concatenate each element with its index. The modified values are being stored in another array arr1 which is being returned at the end.

This brings us to the end of this article where we have learned how to modify all array elements in JavaScript using different methods. I hope this article was helpful to you and that you were able to learn something new from it.

If you have any questions, feel free to post them in the comments section below and I will be more than happy to answer them. Till next time!