An Interest In:
Web News this Week
- April 22, 2024
- April 21, 2024
- April 20, 2024
- April 19, 2024
- April 18, 2024
- April 17, 2024
- April 16, 2024
Stop using Array.map() everywhere
Most of the time I used to see the snippet like this
const fruits = ["apple", "orange", "cherry"];let text = "";document.getElementById("main").innerHTML = text;fruits.map(i => text += i );
In the above snippet, we are adding fruits
text to the DOM in main
ID.
It seems there is no issue in the above snippet, Though there is one major issue, which we will be going see today.
Let's understand the issue by definition of map
, map()
method creates a new array populated with the results of calling a provided function on every element in the calling array.
example:
let n = [1, 2, 3, 4];let add = n.map(i => i + 2);console.log(add); // [3, 4, 5, 6]
NOTE: Using map()
method means returning a new collection of an array.
As discussed, map()
method always returns a new array, so if you dont have any use of a new array then never use map()
method.
When you just need to iterate through an array, I will always recommend using other array methods like forEach
or for..of
.
example:
const fruits = ["apple", "orange", "cherry"];let text = "";fruits.forEach(myFunction);document.getElementById("main").innerHTML = text;function myFunction(item, index) { text += index + ": " + item + "<br>"; }
Why do we care about it?
As we know, map()
method always returns an array. If you just need to update DOM then storing those elements into memory form doesn't add any point.
Of course, for a small chunk of numbers nothing is going to happen, however, if we take a larger number here then it affects the performance side as it will store the value in memory which will be redundant.
Summary
Stop using map()
method, if you just need to iterate through an array.
Start using forEach
or for...of
method, if you want to iterate through an array.
Thanks for reading the article
Hope this post will be useful!
Original Link: https://dev.to/suprabhasupi/stop-using-arraymap-everywhere-57lf
Dev To
An online community for sharing and discovering great ideas, having debates, and making friendsMore About this Source Visit Dev To