Classic JS Tutorial | JS in VS 2026 | JS Examples | jQuery
⚡ Lesson 15 of 30

Higher-Order Functions

Compose powerful data pipelines using map, filter, reduce, and custom higher-order functions.

Functions as Values

In JavaScript, functions are first-class citizens — they can be stored in variables, passed as arguments, and returned from other functions:

const greet = name => `Hello, ${name}!`;

function apply(fn, value) {
  return fn(value);
}

console.log(apply(greet, "Alice")); // "Hello, Alice!"

map

Transform every element of an array:

const temps = [0, 20, 37, 100]; // Celsius
const fahrenheit = temps.map(c => c * 9/5 + 32);
console.log(fahrenheit); // [32, 68, 98.6, 212]

filter

Keep only elements that pass a test:

const people = [
  { name:"Alice", age:25 },
  { name:"Bob",   age:17 },
  { name:"Carol", age:32 },
];
const adults = people.filter(p => p.age >= 18);
console.log(adults.map(p => p.name)); // ["Alice","Carol"]

reduce

Accumulate all elements into a single value:

const cart = [
  { item:"book",   price:29 },
  { item:"pen",    price:5  },
  { item:"laptop", price:999},
];
const total = cart.reduce((sum, item) => sum + item.price, 0);
console.log(total); // 1033

Chaining & Composing

Chain higher-order functions together into readable pipelines:

const data = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const result = data
  .filter(n => n % 2 === 0)  // [2,4,6,8,10]
  .map(n => n ** 2)           // [4,16,36,64,100]
  .reduce((a,b) => a + b, 0); // 220

console.log(result); // 220
← Lesson 14🏠 HomeLesson 16 →