Python Array Iterators (map, filter, reduce)
Modern JavaScript leverages functional iterator methods (.map, .filter, .reduce, .find, .some, .every) to process collections declaratively without manual for loop counter bookkeeping.
"Imagine a factory assembly line: .filter() discards defective items, .map() paints the remaining items, and .reduce() packages all painted items into one shipping container."
Deep Dive: How It Works
.map(fn): Creates a brand new array by applying fn to every element.
.filter(fn): Creates a new array containing only elements where fn returned truthy.
.reduce((acc, curr) => ..., init): Condenses an array down into a single accumulated result (sum, object, histogram).
Syntax Blueprint
items.filter(x => x.active).map(x => x.price).reduce((a, b) => a + b, 0)
Chain array methods cleanly for expressive, readable data transformation pipelines.
Core Rules to Remember
Common Beginner Traps & How to Fix Them
Forgetting the initial value in .reduce().Why it happens: Without an initial value, reduce takes the first element as the accumulator, which can cause type bugs on empty arrays or object transformations.
How to fix: Always provide an explicit initial value: .reduce((sum, n) => sum + n, 0).
Live Interactive Example
Hit Run Code to see it liveYour Turn: Micro Challenge
No pressure! Edit the starter code below and test your solution with instant feedback.
Filter and sum numbers with reduce
- Given const scores = [10, 20, 30, 40];
- Use scores.filter(s => s >= 20) to filter scores >= 20.
- Use .reduce((a, b) => a + b, 0) on the filtered list to find the sum (90).
- Print "Qualified Total: 90".
Finished reading and practicing?
Mark this lesson as completed to update your course progress.