Rate this post

Trong JavaScript, một closure là một hàm có quyền truy cập các biến trong phạm vi bên ngoài nó, thậm chí sau khi hàm bên ngoài đã trả về. Closure cho phép các hàm bên trong “nhớ” trạng thái của hàm bên ngoài của nó thậm chí sau khi hàm bên ngoài đã hoàn thành.

Các bài viết liên quan:

Ví dụ:

function outerFunction(x) {
  let y = 2;

  function innerFunction() {
    console.log(x + y);
  }

  return innerFunction;
}

let myFunction = outerFunction(1);
myFunction(); // sẽ in ra 3

Trong ví dụ này, innerFunction là một closure. Nó có quyền truy cập các biến x và y từ hàm bên ngoài của nó, outerFunction. Thậm chí sau khi outerFunction đã trả về, innerFunction vẫn có quyền truy cập các giá trị của x và y khi nó được định nghĩa, và có thể sử dụng chúng khi nó được gọi.

Closure thường được sử dụng trong JavaScript để tạo các biến và hàm “riêng tư”, bằng cách trả về một hàm bên trong có quyền truy cập một phạm vi riêng tư thay vì công khai các biến và hàm riêng tư trực tiếp. Hoặc để làm việc với các hàm cao cấp như callback, event-listener và quản lý tài nguyên

Closures còn có thể được sử dụng trong việc tạo ra các hàm trả về, hoặc sử dụng trong việc quản lý tài nguyên và giải phóng bộ nhớ, hoặc trong việc tạo các module trong JavaScript.

Tại sao nên sử dụng Closure ?

Sử dụng closure có thể giúp cho code được tổ chức và dễ quản lý hơn, cũng giúp trong việc tạo các hàm nâng cao và dễ dàng xử lý dữ liệu.

Closures cũng đóng vai trò quan trọng trong việc tạo các hàm nâng cao như hàm map(), filter(), reduce() trong JavaScript, cho phép chúng ta xử lý dữ liệu một cách linh hoạt và dễ dàng hơn. Tuy nhiên, sử dụng closure cũng cần chú ý đến các vấn đề như việc giải phóng bộ nhớ và tránh tạo ra các vòng lặp không giải phóng bộ nhớ.

Closures cũng rất hữu ích trong việc giấu thông tin và giới hạn truy cập đến các biến và hàm. Ví dụ, bạn có thể sử dụng closure để chứa các biến và hàm bên trong một hàm ngoài và chỉ cung cấp quyền truy cập đến chúng cho các hàm bên trong đó.

Closures còn được sử dụng trong việc tạo ra các hàm factory và các thiết bị quản lý trạng thái.

Sử dụng closure có thể giúp cho code của bạn trở nên tổ chức và dễ quản lý hơn, tăng tính chất bảo mật của code, giúp trong việc quản lý và giải phóng tài nguyên, và tăng tính linh hoạt của các hàm cao cấp.

Closures còn được sử dụng trong việc xử lý sự kiện trong javascript, khi sử dụng closure bạn có thể truy cập các biến trong phạm vi chính của hàm sự kiện được gọi, điều này giúp cho việc xử lý sự kiện trở nên dễ dàng hơn.

Closures cũng được sử dụng trong việc xử lý đa luồng, sử dụng closure bạn có thể truy cập các biến trong scope chính mà không phải lo lắng về việc race conditions và việc xử lý đa luồng trở nên dễ dàng hơn.

Closures là một tính năng quan trọng trong Javascript, và sử dụng chúng một cách chính xác có thể giúp bạn viết mã nguồn tổ chức hơn, dễ quản lý, linh hoạt và an toàn hơn.

Sử dụng Closure trong javascript như thế nào ?

Sử dụng Closure trong javascript thường là bằng cách tạo một hàm bên trong một hàm khác và trả về hàm bên trong đó. Hàm bên trong sẽ có quyền truy cập các biến trong phạm vi của hàm bên ngoài, và sẽ “nhớ” các giá trị của các biến đó thậm chí sau khi hàm bên ngoài đã hoàn thành.

Ví dụ:

function makeCounter() {
  let count = 0;

  return function() {
    return count++;
  };
}

let counter = makeCounter();
console.log(counter()); // 0
console.log(counter()); // 1
console.log(counter()); // 2

Trong ví dụ này, hàm makeCounter trả về một hàm bên trong có quyền truy cập biến count của hàm bên ngoài. Mỗi lần gọi hàm trả về (counter()), nó sẽ trả về giá trị của count tăng lên một.

Sử dụng closure trong javascript cần chú ý đến việc giải phóng bộ nhớ, tránh tạo ra các vòng lặp không giải phóng, tổ chức và quản lý tốt hơn code.

Tạo và sử dụng Closure trong javascript có thể giúp cho code được tổ chức và dễ quản lý hơn, tăng tính bảo mật, linh hoạt và tối ưu hơn.

Một số  ví dụ cụ thể khi sử dụng Closure.

Ví dụ về sử dụng Closure trong việc tạo một hàm callback:

function greet(name) {
  return function(greeting) {
    console.log(greeting + ', ' + name);
  }
}
let sayHi = greet("John");
sayHi("Hello"); // "Hello, John"
sayHi("Hi"); // "Hi, John"

Trong ví dụ này, hàm greet tạo ra một hàm bên trong và trả về nó, hàm bên trong có quyền truy cập vào biến name của hàm bên ngoài. Khi gọi hàm sayHi(“Hi”) thì sẽ in ra “Hi, John”

Hoặc ví dụ về sử dụng Closure trong việc quản lý trạng thái:

let createToggler = (initialValue) => {

    let value = initialValue;

    return () => {

        value = !value;

        return value;

    }

}

let toggler = createToggler(false);

console.log(toggler()); // true

console.log(toggler()); // false

console.log(toggler()); // true

Trong ví dụ này, hàm createToggler sử dụng closure để quản lý trạng thái của giá trị value. Với mỗi lần gọi hàm toggler() thì giá trị của value sẽ được chuyển đổi từ true sang false hoặc ngược lại, giúp cho việc quản lý trạng thái của giá trị đó trở nên dễ dàng hơn.

Những ví dụ trên chỉ là ví dụ cụ thể về cách sử dụng Closure trong javascript, nhưng có rất nhiều cách khác nữa mà bạn có thể sử dụng closures ví dụ như: quản lý hoặc là thay đổi các giá trị của biến toàn cục trong một hàm, hoặc sử dụng closure để giữ giá trị của một biến trong hàm.

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Contact Me on Zalo
Call now