Let's analyze a movie collection using nothing but array methods. Not a single for loop in sight!
const movies = [
{ title: "The Lion King", year: 1994, rating: 8.5, genre: "animation", minutes: 88 },
{ title: "Inception", year: 2010, rating: 8.8, genre: "sci-fi", minutes: 148 },
{ title: "Coco", year: 2017, rating: 8.4, genre: "animation", minutes: 105 },
{ title: "The Martian", year: 2015, rating: 8.0, genre: "sci-fi", minutes: 144 },
{ title: "Black Panther", year: 2018, rating: 7.3, genre: "action", minutes: 134 },
{ title: "Mad Max: Fury Road", year: 2015, rating: 8.1, genre: "action", minutes: 120 },
];
// 1. All titles
const titles = movies.map((m) => m.title);
console.log("🎬 Titles:", titles.join(", "));
// 2. Highly rated (8.5+)
const greats = movies.filter((m) => m.rating >= 8.5).map((m) => m.title);
console.log("⭐ Must-watch:", greats.join(", "));
// 3. Total running time
const totalMinutes = movies.reduce((sum, m) => sum + m.minutes, 0);
console.log(`⏱️ Watching everything takes ${Math.floor(totalMinutes / 60)}h ${totalMinutes % 60}m`);
// 4. Average rating
const average = movies.reduce((sum, m) => sum + m.rating, 0) / movies.length;
console.log(`📊 Average rating: ${average.toFixed(2)}`);
// 5. Any super-long movies?
console.log("😴 Any over 2.5 hours?", movies.some((m) => m.minutes > 150));
// 6. The newest movie
const newest = movies.reduce((a, b) => (b.year > a.year ? b : a));
console.log(`🆕 Newest: ${newest.title} (${newest.year})`);
// 7. Count by genre
const byGenre = movies.reduce((counts, m) => {
counts[m.genre] = (counts[m.genre] || 0) + 1;
return counts;
}, {});
console.log("🍿 By genre:", byGenre);
// 8. Top 3 by rating
const top3 = [...movies]
.sort((a, b) => b.rating - a.rating)
.slice(0, 3)
.map((m, i) => `${i + 1}. ${m.title} (${m.rating})`);
console.log("🏆 Top 3:");
top3.forEach((line) => console.log(" " + line));
It prints
🎬 Titles: The Lion King, Inception, Coco, The Martian, Black Panther, Mad Max: Fury Road
⭐ Must-watch: The Lion King, Inception
⏱️ Watching everything takes 12h 19m
📊 Average rating: 8.18
😴 Any over 2.5 hours? false
🆕 Newest: Black Panther (2018)
🍿 By genre: { animation: 2, 'sci-fi': 2, action: 2 }
🏆 Top 3:
1. Inception (8.8)
2. The Lion King (8.5)
3. Coco (8.4)(In step 6 we skipped reduce's starting value on purpose, so it starts with the first movie. That's safe here because we know the array isn't empty. Also notice that Node prints 'sci-fi' with quotes, because a key with a hyphen in it isn't a valid variable name.)
Eight different questions answered, each in just one or two lines. Imagine writing all that with for loops!
Add more movies (your favorites!) and a few more questions: Which movies came out after 2015? What's the shortest movie? What's the average length of the animation movies only? (That last one needs a filter followed by a reduce.)
Grade 10 is complete! You've just learned the tools that professional JavaScript developers reach for dozens of times every day. Your code is about to get a whole lot shorter and cleaner.
And now, the moment you've been waiting for. In Grade 11, we finally take control of web pages themselves.