In JavaScript, methods like map, filter, concat, and reduce are "pure" – meaning they don't change the original array. Instead, they produce a new array based on the logic you supply.
For instance, when you do:
xs.map(x => x.prop);
The original array xs remains untouched, and a brand new array is returned with the mapped values.
But here's a pitfall: some folks might be tempted to use a map just to loop over the array, say for logging:
xs.map((x, i) => console.log(`element #${i}:`, x));
This misuses map, which is intended to transform data, not just to iterate. For side effects like logging, forEach is a much better choice:
xs.forEach((x, i) => console.log(`element #${i}:`, x));
Bad Practice:
Using map without utilizing its return value:
characters.map(character => character.name);
console.log(characters); // The original array remains unchanged!
Recommended:
Use map when you actually intend to create a new transformed array:
const characterNames = characters.map(character => character.name);
console.log(characterNames); // A shiny new array with character names!
The lesson? Make sure to use array methods in a way that aligns with their intended purpose. This ensures that your code is both efficient and easy for others to understand.
Top comments (0)