JS Array Methods Cheat Sheet: Map, Filter, Reduce Traps
### Direct answer: Use map to transform every element, filter to keep some, reduce to collapse many into one, and find / some / every to ask questions without…
Direct answer: Use map to transform every element, filter to keep some, reduce to collapse many into one, and find / some / every to ask questions without building a new array.
## Why the array keeps coming up
Since ES2023, toSorted, toReversed, toSpliced, and with return copies have been available, so you can drop the […arr].sort() workaround. Run [‘1’,’2',’3'].map(parseInt) in any console, and you get [1, NaN, NaN]. The map passes (value, index, array) to the callback, and parseInt reads the index as its radix argument. Chaining is fine for small arrays. arr.map(f). filter(g) allocates an intermediate array; on large data, one reduces it, or a single loop avoids it.
> Since ES2023, toSorted, toReversed, toSpliced, and with return copies, so you can drop the […arr].sort() workaround.
Get Tom Morgan’s stories in your inbox
Join Medium for free to get updates from this writer.
## What changes in practice
It is a static method on Object, not an array method, and it returns a null-prototype object. A map callback with braces and no return yields an array of undefined. A filter callback that returns an object is always truthy.
## Where people get stuck
Always give a reduced initial value. Prefer toSorted / toReversed over in-place versions on shared data.
### The short version
- A map callback with braces and no return yields an array of undefined.
- A filter callback that returns an object is always truthy.
- Always give a reduced initial value.
Read the full article: https://www.codetalenthub.io/js-array-methods-cheat-sheet/
