map, filter, and reduce Best Practices in JavaScript

map, filter, and reduce Best Practices in JavaScript

map, filter, and reduce are powerful but have best practices. Here is how to use them well.

1. Always Return From the Callback

// bad: no return (undefined values)
arr.map((n) => { n * 2; });

// good: return
arr.map((n) => n * 2);
arr.map((n) => { return n * 2; });
``
Arrow functions with block bodies need `return`.

### 2. Do Not Mutate the Original

```js
// bad: mutating
arr.map((n) => { arr.push(n); return n; });

// good: pure
arr.map((n) => n * 2);
``
### 3. Use `forEach` for Side Effects

```js
// bad: using map for side effects
arr.map((n) => console.log(n));

// good: forEach
arr.forEach((n) => console.log(n));
``
### 4. Always Pass an Initial Value to `reduce`

```js
arr.reduce((acc, n) => acc + n, 0); // not arr.reduce((acc, n) => acc + n)
``
### 5. Use `find`/`some`/`every` for Early Exit

```js
// bad: filter when you only need one
const first = arr.filter((n) => n > 5)[0];

// good: find (stops early)
const first = arr.find((n) => n > 5);
``
### 6. Use a Comparator with `sort`

```js
// bad: string comparison for numbers
[10, 2, 1].sort(); // [1, 10, 2]

// good: numeric comparator
[10, 2, 1].sort((a, b) => a - b); // [1, 2, 10]
``
### 7. Do Not Sort In Place (Use Spread)

```js
// bad: mutates
arr.sort((a, b) => a - b);

// good: copy first
const sorted = [...arr].sort((a, b) => a - b);
``
### 8. Use `flatMap` Instead of `map` + `flat`

```js
// okay
arr.map((n) => [n, n * 2]).flat();

// better
arr.flatMap((n) => [n, n * 2]);
``
### 9. Keep Callbacks Pure and Small

Each callback should do one thing. If it is complex, extract it:

```js
const isAdult = (u) => u.age >= 18;
const getName = (u) => u.name;
const names = users.filter(isAdult).map(getName);
``
### 10. Avoid the `map(parseInt)` Trap

```js
// bad: ["1", "2", "3"].map(parseInt) -> [1, NaN, NaN]
// good:
["1", "2", "3"].map((s) => parseInt(s, 10));
``
### The Takeaway

Best practices: always return from callbacks, do not mutate the original, use `forEach` for side effects, always pass an initial value to `reduce`, use `find`/`some`/`every` for early exit, use a comparator with `sort` and copy first, use `flatMap` instead of `map`+`flat`, keep callbacks small, and avoid the `map(parseInt)` trap.