ADVERTISEMENT
Google AdSense Slot (headerLeaderboard)
Set your Publisher ID in src/config/ads.ts to display live ads.
JavaScript Tutorial• 6 min read
JavaScript Arrays & Methods
Modern functional programming with map, filter, and reduce
An array is a special variable that can hold more than one value at a time. JavaScript provides powerful built-in methods to transform and manipulate array data.
Essential Array Methods
.map(): Transforms every item and returns a new array of the same length.
.filter(): Filters elements based on a condition and returns a new array with matching items.
.find(): Returns the first element that satisfies the testing function.
.reduce(): Reduces the array to a single cumulative value (like sum or count).
Functional Array Processing
const students = [
{ name: "Alice", score: 95 },
{ name: "Bob", score: 72 },
{ name: "Charlie", score: 88 },
{ name: "Diana", score: 64 },
];
// 1. Filter: passed students (score >= 70)
const passing = students.filter(s => s.score >= 70);
// 2. Map: extract student names
const honorRoll = passing.map(s => s.name.toUpperCase());
// 3. Reduce: calculate average score
const totalScore = students.reduce((sum, s) => sum + s.score, 0);
const average = totalScore / students.length;
console.log("Honor Roll:", honorRoll);
console.log("Class Average:", average);ADVERTISEMENT
Google AdSense Slot (inContentBanner)
Set your Publisher ID in src/config/ads.ts to display live ads.
Test Yourself With Exercise
Which array method creates a new array by calling a callback function on every element?