Bộ đếm sử dụng Closure trong JavaScript

Hãy viết lại đoạn mã chúng ta đã xem xét để hàm được trả về mỗi lần tăng giá trị của biến num lên một đơn vị:

javascriptfunction test() {
  let num = 1;
  
  return function() {
    console.log(num);
    num++; // thêm một
  }
}

let func = test();

Kết quả là mỗi lần gọi hàm func sẽ in ra console một giá trị mới:

javascriptfunction test() {
  let num = 1;
  
  return function() {
    console.log(num);
    num++;
  }
}

let func = test();

func(); //sẽ in ra 1
func(); //sẽ in ra 2
func(); //sẽ in ra 3
func(); //sẽ in ra 4
func(); //sẽ in ra 5

Như vậy, chúng ta đã triển khai một bộ đếm số lần gọi hàm, sử dụng closure (chính xác hơn là sử dụng biến num từ closure của hàm chúng ta).

Lưu ý rằng mỗi lần gọi hàm test sẽ trả về một hàm mới, mà sẽ có closure riêng của nó. Có nghĩa là các bộ đếm khác nhau sẽ hoạt động độc lập:

javascriptfunction test() {
  let num = 1;
  
  return function() {
    console.log(num);
    num++;
  };
}

let func1 = test(); // bộ đếm thứ nhất
func1();  //sẽ in ra 1
func1();  //sẽ in ra 2

let func2 = test(); // bộ đếm thứ hai
func2();  //sẽ in ra 1
func2();  //sẽ in ra 2

Như vậy, cùng một biến num cho các hàm khác nhau sẽ có giá trị khác nhau!

Có nghĩa là nếu chúng ta gọi hàm test hai lần, thì các hàm nhận được từ nó sẽ hoạt động một cách độc lập và mỗi hàm trong số này sẽ có biến num độc lập của riêng nó.