Closure CavesISSUE #21 of 61

array methods · map · filter · reduce

LambdaVSThe Mutator

Lambda saysmap transforms, filter selects, reduce accumulates — the trio of functional array methods.

map returns a new array with each item transformed; filter returns the items that pass a test; reduce folds the array into a single value (sum, object, anything). All three are non-mutating and chainable, replacing most manual loops with clear, declarative pipelines.

Power-ups you unlock

map: transform each → new array
filter: keep items passing a test
reduce: fold into one value
Non-mutating and chainable

The Mutator attacks — common mistakes

Using map for side effects (use forEach)
Forgetting reduce’s initial value
Not returning from the map/filter callback

Boss battleChain filter then map then reduce: keep evens, double them, sum the result.

Example code

<!doctype html><html><head><meta charset="utf-8"></head>
<body style="background:#06040d;color:#e6e0ff;font-family:monospace;padding:20px"><pre id="o"></pre>
<script>const r=[1,2,3,4,5,6].filter(n=>n%2===0).map(n=>n*2).reduce((a,b)=>a+b,0);
document.getElementById('o').textContent='result = '+r;</script></body></html>

▶ Open the interactive comic issue

‹ Array Methods · Slice · Splice Array Methods · Find · FindIndex · Some · Every ›