Closures trong JavaScript xảy ra khi một hàm vẫn giữ quyền truy cập vào các biến trong phạm vi từ vựng (lexical scope) của nó, ngay cả sau khi hàm bên ngoài đã kết thúc thực thi. Điều này cho phép các hàm "ghi nhớ" giá trị và duy trì trạng thái.
Sau đây là một ví dụ đơn giản
function outerFunction() { let counter = 0; // Local variable return function innerFunction() { counter++; // Inner function remembers 'counter' console.log(counter); };
} const increment = outerFunction(); // Returns innerFunction
increment(); // 1
increment(); // 2
increment(); // 3
Giải thích:
outerFunction()
định nghĩa một biến cục bộ (counter
).innerFunction()
thay đổi giá trị củacounter
, mặc dù hàmouterFunction
đã được thực thi xong!- Tuy nhiên,
innerFunction()
vẫn giữ quyền truy cập vàocounter
nhờ vào cơ chế closure. - Mỗi lần gọi
increment()
sẽ cập nhậtcounter
đã được "giữ lại", cho thấy trạng thái được duy trì liên tục.
Closures rất hữu ích để đóng gói logic, duy trì biến riêng tư và tạo các trình xử lý sự kiện (event handler) hiệu quả.
Hy vọng chút kiến thức này sẽ giúp ích đối với các bạn!