Array Methods: Map, Filter, and Reduce

If you’re coming from another language, you might use for loops to manipulate arrays in JavaScript. While that works, the functional array methods—map, filter, and reduce—are cleaner and more expressive. Map transforms an array. If you have an array of objects and want an array of just the names, you use arr.map(item => item.name). Filter creates a new array based on a condition. Want only users who are active? arr.filter(user => user.active). Reduce is the powerhouse; it accumulates values. Need the sum of a shopping cart? cart.reduce((total, item) => total + item.price, 0). Using these methods leads to fewer bugs because they are immutable (they don't change the original array) and they chain beautifully. I often chain filter first to clean the data, then map to extract the data I need.