Lesson

Map a list

The lots on the map are an ordered list. map walks every item and builds a new list from what you return.

const lots = ["forum-east", "cardo-north", "gate-west"];
const tags = lots.map((lot) => lot);
// tags is a new array
// lots is still the original

(lot) => lot is the arrow from the last lesson. map calls it once per lot. Return something else and the new list changes.

const nums = [1, 2, 3];
const doubled = nums.map((n) => n * 2);
// doubled is [2, 4, 6]

The town paints this way: lots.map((lot) => <House tag={lot.tag} />).

I'm ready — try the exercise →