Hàm bậc cao
Một hàm chấp nhận và/hoặc trả về một hàm khác được gọi là hàm bậc cao.
Của nó bậc cao hơn bởi vì thay vì chuỗi, số hoặc booleans, nó sẽ đi cao hơn để hoạt động trên các chức năng. Khá meta.
Với các chức năng trong JavaScript, bạn có thể
- Lưu trữ chúng dưới dạng biến
- Sử dụng chúng trong mảng
- Gán chúng làm thuộc tính đối tượng (phương thức)
- Truyền chúng dưới dạng đối số
- Trả lại chúng từ các chức năng khác
Giống như bất kỳ phần dữ liệu nào khác. Đó là chìa khóa ở đây.
Chức năng hoạt động trên dữ liệu
Chuỗi là dữ liệu
sayHi = (name) => `Hi, ${name}!`;
result = sayHi('User');
console.log(result); // 'Hi, User!'
Số là dữ liệu
double = (x) => x * 2;
result = double(4);
console.log(result); // 8
Booleans là dữ liệu
getClearance = (allowed) => (allowed ? 'Access granted' : 'Access denied');
result1 = getClearance(true);
result2 = getClearance(false);
console.log(result1); // 'Access granted'
console.log(result2); // 'Access denied'
Đối tượng là dữ liệu
getFirstName = (obj) => obj.firstName;
result = getFirstName({
firstName: 'Yazeed'
});
console.log(result); // 'Yazeed'
Mảng là dữ liệu
len = (array) => array.length;
result = len([1, 2, 3]);
console.log(result); // 3
5 loại này là công dân hạng nhất trong mọi ngôn ngữ chính thống.
Điều gì làm cho họ hạng nhất? Bạn có thể chuyển chúng đi khắp nơi, lưu trữ chúng trong các biến và mảng, sử dụng chúng làm đầu vào cho các phép tính. Bạn có thể sử dụng chúng như bất kỳ phần dữ liệu nào.
Hàm cũng có thể là dữ liệu
Chức năng như đối số
isEven = (num) => num % 2 === 0;
result = [1, 2, 3, 4].filter(isEven);
console.log(result); // [2, 4]
Xem như thế nào filter sử dụng isEven để quyết định những con số để giữ? isEven, một chức nănglà một tham số sang chức năng khác.
Nó được gọi bởi filter cho mỗi số và sử dụng giá trị được trả về true hoặc false để xác định xem một số nên được giữ lại hay loại bỏ.
Chức năng trả về
add = (x) => (y) => x + y;
add yêu cầu hai tham số, nhưng không phải tất cả cùng một lúc. Đó là một chức năng chỉ yêu cầu xtrả về một hàm chỉ yêu cầu y.
Một lần nữa, điều này chỉ có thể thực hiện được vì JavaScript cho phép các hàm trở thành giá trị trả về — giống như chuỗi, số, boolean, v.v.
Bạn vẫn có thể cung cấp x và y ngay lập tức, nếu bạn muốn, với một lệnh gọi kép
result = add(10)(20);
console.log(result); // 30
Hoặc x bây giờ và y sau:
add10 = add(10);
result = add10(20);
console.log(result); // 30
Hãy tua lại ví dụ cuối cùng đó. add10 là kết quả của việc gọi add với một tham số. Hãy thử đăng nhập nó trong bảng điều khiển.
add10 là một chức năng có một y và trả về x + y. Sau khi bạn cung cấp ynó nhanh chóng tính toán và trả về kết quả cuối cùng của bạn.
Khả năng tái sử dụng cao hơn
Có lẽ lợi ích lớn nhất của HOF là khả năng sử dụng lại nhiều hơn. Không có chúng, các phương thức Mảng ra mắt của JavaScript — map, filtervàreduce– sẽ không tồn tại!
Đây là danh sách người dùng. Chúng tôi sẽ thực hiện một số tính toán với thông tin của họ.
users = [
{
name: 'Yazeed',
age: 25
},
{
name: 'Sam',
age: 30
},
{
name: 'Bill',
age: 20
}
];
Bản đồ
Nếu không có các hàm bậc cao hơn, chúng ta sẽ luôn cần các vòng lặp để bắt chướcmapchức năng của.
getName = (user) => user.name;
usernames = [];
for (let i = 0; i < users.length; i++) {
const name = getName(users[i]);
usernames.push(name);
}
console.log(usernames);
// ["Yazeed", "Sam", "Bill"]
Hoặc chúng ta có thể làm điều này!
usernames = users.map(getName);
console.log(usernames);
// ["Yazeed", "Sam", "Bill"]
Lọc
Trong một thế giới không có HOF, chúng ta vẫn cần các vòng lặp để tạo lại filterchức năng của quá.
startsWithB = (string) => string.toLowerCase().startsWith('b');
namesStartingWithB = [];
for (let i = 0; i < users.length; i++) {
if (startsWithB(users[i].name)) {
namesStartingWithB.push(users[i]);
}
}
console.log(namesStartingWithB);
// [{ "name": "Bill", "age": 20 }]
Hoặc chúng ta có thể làm điều này!
namesStartingWithB = users.filter((user) => startsWithB(user.name));
console.log(namesStartingWithB);
// [{ "name": "Bill", "age": 20 }]
Giảm
Phải, giảm cũng vậy… Không thể làm được nhiều thứ hay ho nếu không có các hàm bậc cao!! ?
total = 0;
for (let i = 0; i < users.length; i++) {
total += users[i].age;
}
console.log(total);
// 75
Làm sao đây?
totalAge = users.reduce((total, user) => user.age + total, 0);
console.log(totalAge);
// 75
Tóm lược
- Chuỗi, số, bool, mảng và đối tượng có thể được lưu trữ dưới dạng biến, mảng và thuộc tính hoặc phương thức.
- JavaScript xử lý các chức năng theo cùng một cách.
- Điều này cho phép các chức năng hoạt động trên các chức năng khác: hàm bậc cao.
- Ánh xạ, bộ lọc và thu nhỏ là những ví dụ điển hình — và tạo các mẫu phổ biến như chuyển đổi, tìm kiếm và tổng hợp danh sách dễ dàng hơn nhiều!
tôi đang ở trên Twitter nếu bạn muốn nói chuyện. Cho đến lần sau!
Bảo trọng,
Yazeed Bzadough
yazeedb.com
