BitWithBite
Full-Stack Worksheet
🔁 Arrays: map, filter, reduce
SCORE___ / 20
NameClassDate
After this worksheet you can
Use map/filter/reduceUse find and spreadExplain immutabilityChain array methods📚 Quick Recap
🎯 What you'll practice: Transforming, filtering, and reducing arrays without mutation.
🧠 Section A · Concept Check ● BEGINNER 4 × 1 = 4
1.map() returns an array of:
2.filter() returns:
3.reduce() collapses an array into:
4The spread operator is written as:
🧮 Section B · Problem Solving ● INTERMEDIATE 2 + 3×3 = 11
5.find() returns the first match or .
6None of map/filter/reduce the original array.
7Use .map() to double every number in [1,2,3].
8Use .filter() to get only numbers greater than 10 from [5,12,8,20].
9Why does React rely on array methods returning new arrays instead of mutating in place?
🚀 Section C · Challenge ● CHALLENGE 5
10Given an array of order objects with a "total" field, write a one-line reduce() to compute the sum of all totals.
💭 Reflection — the most useful thing I learned:
A ___/4 B ___/11 C ___/5 Total ___/20
Teacher's Signature
Parent's Signature
✂ answer key — fold or cut before handing out
1-B 2-B 3-A 4-B | 5 = undefined 6 = mutate 7 = [1,2,3].map(n=>n*2) → [2,4,6] 8 = [5,12,8,20].filter(n=>n>10) → [12,20] 9 = React detects changes by comparing old and new references; mutating an array in place keeps the same reference, so React can miss the update entirely | 10 = orders.reduce((sum, o) => sum + o.total, 0)