Trong hướng dẫn này, bạn sẽ được tìm hiểu về hàm ẩn danh (Anonymous Function) trong JavaScript và cách chúng ta thường sử dụng hàm ẩn danh.
Anonymous Function là gì?
Một Anonymous Function là một hàm không có tên (hay còn gọi là hàm ẩn danh). Và một hàm ẩn danh thường không thể truy cập được sau khi tạo lần đầu.
Sau đây ta có một hàm ẩn danh hiển thị một thông báo:
let thongBao = function() {
console.log("Anonymous Function");
};
thongBao();
Trong ví dụ này, hàm ẩn danh không có tên giữa từ khóa function và dấu ngoặc đơn ().
Thông thường thì nó phải là như thế này:
function thongBao() {
console.log("Anonymous Function");
}
thongBao();
Nhưng ta sử dụng hàm ẩn danh là có lý do (lát sẽ biết)
Và vì sau này chúng ta cần gọi hàm ẩn danh nên chúng ta gán hàm cho biến thongBao
Gọi hàm thì tương tự nhau.
Sử dụng hàm ẩn danh làm đối số của hàm khác
Chúng ta thường sử dụng các hàm ẩn danh làm đối số của các hàm khác. Ví dụ:
// Sử dụng hàm ẩn danh làm đối số
setTimeout(function() {
console.log("Thực thi sau 1s nữa")
}, 1000);
Truyền hàm làm đối số của hàm khác là hoàn toàn có thể.
Trong ví dụ này, chúng ta truyền một hàm ẩn danh vào hàm setTimeout(). Hàm setTimeout() thực thi hàm ẩn danh này một giây sau đó.
> Để tìm hiểu chi tiết hơn về setTimeout() cũng thì mời bạn xem hướng dẫn XỬ LÝ BẤT ĐỒNG BỘ trong JavaScript.
Hàm tự gọi ngay lập tức
Nếu bạn muốn tạo một hàm và thực thi nó ngay sau khi khai báo (Immediately invoked function expression), bạn có thể sử dụng hàm ẩn danh như sau:
(function() {
console.log("Hàm tự gọi ngay lập tức IIFE");
})();
Nó hoạt động như thế nào?
Đầu tiên, phần bên dưới đây định nghĩa một hàm:
(function() {
console.log("Hàm tự gọi ngay lập tức IIFE");
})
Tiếp theo, chúng ta thêm dấu ngoặc đơn ở cuối () cho phép gọi hàm ngay lập tức:
(function() {
console.log("Hàm tự gọi ngay lập tức IIFE");
})();
Và thi thoảng, bạn có thể truyền đối số cho nó như thế này:
let sinhVien = {
ten: "Hương",
tuoi: 18
};
// Ví dụ truyền đối số cho hàm IIFE
(function() {
console.log(`${sinhVien.ten} ${sinhVien.tuoi} tuổi`);
})(sinhVien);
> Note: Dấu `` gọi là template literals được giới thiệu trong phiên bản ES6 được sử dụng để nội suy chuỗi.
Arrow function
ES6 đã giới thiệu arrow function để cung cấp cách viết tắt để khai báo các hàm ẩn danh. Đây có lẽ là một trong những tính năng mình thích nhất của ES6. :D
Ví dụ, hàm này:
let thongBao = function() {
console.log("Anonymous Function");
};
Có thể được viết ngắn hơn bằng cách sử dụng arrow function như sau:
let thongBao = () => console.log("Anonymous Function");
Tương tự, hàm ẩn danh này:
let tong2So = function(a, b) {
return a + b;
};
Cũng có thể viết ngắn hơn với Arrow function như sau:
let tong2So = (a, b) => a + b;
Tổng kết về hàm ẩn danh
Hàm ẩn danh (Anonymous Function) trong JavaScript là các hàm không có tên. Nó có thể được sử dụng như một đối số cho các hàm khác hoặc như một hàm tự thực thi ngay lập tức.
---
HỌC VIỆN ĐÀO TẠO CNTT NIIT - ICT HÀ NỘI
Học Lập trình chất lượng cao (Since 2002). Học thực tế + Tuyển dụng ngay!
Đc: Tầng 3, 25T2, N05, Nguyễn Thị Thập, Cầu Giấy, Hà Nội
SĐT: 02435574074 - 0968051561
Email: hello@niithanoi.edu.vn
Fanpage: https://facebook.com/NIIT.ICT/
#niit #niithanoi #niiticthanoi #hoclaptrinh #khoahoclaptrinh #hoclaptrinhjava #hoclaptrinhphp #java #php #python