5.1 Khái niệm cơ bản
Hàm bậc cao là một khía cạnh quan trọng của lập trình hàm và được sử dụng rộng rãi trong JavaScript. Chúng cho phép viết mã một cách trừu tượng hơn, ngắn gọn hơn và có thể tái sử dụng.
Hàm bậc cao là gì?
Hàm bậc cao (higher-order functions) là các hàm có thể nhận các hàm khác làm tham số hoặc trả về các hàm khác làm kết quả. Chúng cho phép sử dụng hàm như đối tượng hạng nhất, điều này giúp tạo ra các chương trình trừu tượng và mô-đun hơn.
Ví dụ về hàm bậc cao
- Truyền hàm như là tham số.
- Trả về hàm từ các hàm khác.
5.2 Truyền hàm như là tham số
Sử dụng các phương thức mảng tích hợp
JavaScript cung cấp nhiều phương thức tích hợp để làm việc với mảng, những phương thức này là các hàm bậc cao như
forEach(), map(), filter(), reduce() và các phương thức khác.
1. Phương thức forEach()
Phương thức forEach() thực hiện một hàm được chỉ định một lần cho mỗi phần tử của mảng.
const numbers = [1, 2, 3, 4, 5];
numbers.forEach(function(number) {
console.log(number);
});
// In ra: 1 2 3 4 5
2. Phương thức map()
Phương thức map() tạo một mảng mới bằng cách gọi một hàm được chỉ định cho mỗi phần tử của mảng.
const numbers = [1, 2, 3, 4, 5];
const squaredNumbers = numbers.map(function(number) {
return number * number;
});
console.log(squaredNumbers);
// In ra: [1, 4, 9, 16, 25]
3. Phương thức filter()
Phương thức filter() tạo ra một mảng mới với tất cả các phần tử vượt qua kiểm tra do hàm được truyền vào chỉ định.
const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(function(number) {
return number % 2 === 0;
});
console.log(evenNumbers);
// In ra: [2, 4]
4. Phương thức reduce()
Phương thức reduce() áp dụng một hàm cho một bộ tích lũy và mỗi phần tử của mảng (từ trái sang phải), làm giảm nó xuống một giá trị duy nhất.
const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce(function(total, number) {
return total + number;
}, 0);
console.log(sum);
// In ra: 15
5.3 Trả về hàm từ các hàm khác
Hàm bậc cao có thể trả về các hàm khác, cho phép tạo ra các hàm linh hoạt và cấu hình được.
1. Currying
Currying là quá trình chuyển đổi một hàm nhận nhiều tham số thành một hàm nhận một tham số và trả về một hàm mới nhận tham số tiếp theo, và cứ thế tiếp tục.
Ví dụ về currying:
function multiply(a) {
return function(b) {
return a * b;
};
}
const multiplyByTwo = multiply(2);
console.log(multiplyByTwo(5)); // In ra: 10
const multiplyByThree = multiply(3);
console.log(multiplyByThree(5)); // In ra: 15
2. Tạo hàm có thể tùy chỉnh
Hàm bậc cao cho phép tạo ra các hàm có thể tùy chỉnh thông qua tham số truyền vào.
Ví dụ:
function createGreeting(greeting) {
return function(name) {
console.log(`${greeting}, ${name}!`);
};
}
const sayHello = createGreeting('Hello');
sayHello('Alice'); // In ra: Hello, Alice!
const sayHi = createGreeting('Hi');
sayHi('Bob'); // In ra: Hi, Bob!
5.4 Ứng dụng thực tế
Hãy xem xét ứng dụng thực tế của hàm bậc cao.
Hàm compose()
Hàm compose() cho phép kết hợp nhiều hàm thành một hàm để áp dụng chúng theo chuỗi:
function compose(...functions) {
return function(initialValue) {
return functions.reduceRight((value, func) => func(value), initialValue);
};
}
const addOne = x => x + 1;
const double = x => x * 2;
const addOneAndDouble = compose(double, addOne);
console.log(addOneAndDouble(5)); // In ra: 12 (đầu tiên cộng 1 vào 5, sau đó nhân đôi kết quả)
Hàm bậc cao không đồng bộ
Hàm bậc cao không đồng bộ cho phép làm việc với các thao tác không đồng bộ, như yêu cầu API hoặc làm việc với bộ đếm thời gian:
function fetchData(callback) {
setTimeout(() => {
callback('Data received');
}, 1000);
}
function processData(data) {
console.log(data);
}
fetchData(processData);
// In ra: Data received (sau 1 giây)
GO TO FULL VERSION