Mục đích của bao đóng trong JavaScript là gì?

Trong thực tế, các bao đóng có thể tạo ra các thiết kế thanh lịch, cho phép tùy chỉnh các tính toán khác nhau, các cuộc gọi bị trì hoãn, gọi lại, tạo phạm vi đóng gói, v.v.

Một ví dụ là phương thức sắp xếp của mảng chấp nhận hàm điều kiện sắp xếp làm đối số

[1, 2, 3].sort(function (a, b) {
    .. // Sort conditions
});

Ánh xạ các hàm dưới dạng phương thức ánh xạ của mảng ánh xạ một mảng mới theo điều kiện của đối số hàm

[1, 2, 3].map(function (element) {
    return element * 2;
}); // [2, 4, 6]

Thường thì việc triển khai các chức năng tìm kiếm sẽ thuận tiện bằng cách sử dụng các đối số chức năng xác định các điều kiện gần như không giới hạn cho tìm kiếm

someCollection.find(function (element) {
    return element.someProperty == 'searchCondition';
});

Ngoài ra, chúng ta có thể lưu ý việc áp dụng các hàm, chẳng hạn như phương thức forEach áp dụng một hàm cho một mảng các phần tử

[1, 2, 3].forEach(function (element) {
    if (element % 2 != 0) {
        alert(element);
    }
}); // 1, 3

Một hàm được áp dụng cho các đối số (đối với danh sách các đối số — khi áp dụng và đối với các đối số đã định vị — khi gọi)

Closure là một trong những khái niệm quan trọng trong JavaScript. Nó được thảo luận rộng rãi và vẫn còn nhầm lẫn khái niệm. Hãy hiểu sự đóng cửa là gì

Trước hết, chúng ta hãy xem định nghĩa về Closure do Douglas Crockford đưa ra. crockford. com/javascript/riêng tư. html

Bao đóng có nghĩa là một hàm bên trong luôn có quyền truy cập vào các vars và tham số của hàm bên ngoài của nó, ngay cả sau khi hàm bên ngoài đã trả về

Bạn đã học được rằng chúng ta có thể tạo các hàm lồng nhau trong JavaScript. Hàm bên trong có thể truy cập các biến và tham số của hàm bên ngoài (tuy nhiên, không thể truy cập đối tượng đối số của hàm bên ngoài). Xem xét ví dụ sau

function OuterFunction() {

    var outerVariable = 1;

    function InnerFunction() {
        alert(outerVariable);
    }

    InnerFunction();
}

Trong ví dụ trên, InnerFunction() có thể truy cập biến ngoài

Bây giờ, theo định nghĩa ở trên, InnerFunction() có thể truy cập biến ngoài ngay cả khi nó sẽ được thực thi riêng. Xem xét ví dụ sau

Ví dụ. Khép kín

function OuterFunction() {

    var outerVariable = 100;

    function InnerFunction() {
        alert(outerVariable);
    }

    return InnerFunction;
}
var innerFunc = OuterFunction();

innerFunc(); // 100

Thử nó

Trong ví dụ trên,

[1, 2, 3].map(function (element) {
    return element * 2;
}); // [2, 4, 6]

0 trả về InnerFunction từ OuterFunction khi bạn gọi OuterFunction(). Một biến

[1, 2, 3].map(function (element) {
    return element * 2;
}); // [2, 4, 6]

1 chỉ tham chiếu đến InnerFunction(), không phải OuterFunction(). Vì vậy, bây giờ, khi bạn gọi innerFunc(), nó vẫn có thể truy cập vào

[1, 2, 3].map(function (element) {
    return element * 2;
}); // [2, 4, 6]

2 được khai báo trong OuterFunction(). Điều này được gọi là Đóng cửa

Một hàm có thể trả về một hàm khác trong JavaScript. Một hàm được gán cho một biến được gọi là biểu thức hàm

Một đặc điểm quan trọng của bao đóng là các biến bên ngoài có thể giữ trạng thái của chúng giữa nhiều lần gọi. Hãy nhớ rằng, hàm bên trong không giữ bản sao riêng của các biến bên ngoài mà nó tham chiếu đến các biến bên ngoài, điều đó có nghĩa là giá trị của các biến bên ngoài sẽ bị thay đổi nếu bạn thay đổi nó bằng hàm bên trong

Ví dụ. Khép kín

function Counter() {
    var counter = 0;

    function IncreaseCounter() {
        return counter += 1;
    };

    return IncreaseCounter;
}

var counter = Counter();
alert(counter()); // 1
alert(counter()); // 2
alert(counter()); // 3
alert(counter()); // 4

Thử nó

Trong ví dụ trên, hàm bên ngoài Counter trả về tham chiếu của hàm bên trong TăngCounter(). TăngCounter tăng bộ đếm biến bên ngoài lên một. Vì vậy, gọi hàm bên trong nhiều lần sẽ tăng bộ đếm lên một lần mỗi lần

Đóng cửa có giá trị ở nhiều cấp độ của các chức năng bên trong

Ví dụ. Khép kín

function Counter() {
    
    var counter = 0;

    setTimeout( function () {
        var innerCounter = 0;
        counter += 1;
        alert("counter = " + counter);

        setTimeout( function () {
            counter += 1;
            innerCounter += 1;
            alert("counter = " + counter + ", innerCounter = " + innerCounter)
        }, 500);

    }, 1000);
};

Counter();

Thử nó

Theo định nghĩa bao đóng, nếu hàm bên trong truy cập các biến của hàm bên ngoài thì chỉ nó được gọi là bao đóng

Sau đây không phải là một đóng cửa

________số 8

Khi nào thì sử dụng Đóng cửa?

Bao đóng rất hữu ích trong việc ẩn chi tiết triển khai trong JavaScript. Nói cách khác, có thể hữu ích khi tạo các biến hoặc hàm riêng

Ví dụ sau đây cho thấy cách tạo các hàm & biến riêng tư

Ví dụ. Khép kín

var counter = (function() {
  var privateCounter = 0;
  function changeBy(val) {
    privateCounter += val;
  }
  return {
    increment: function() {
      changeBy(1);
    },
    decrement: function() {
      changeBy(-1);
    },
    value: function() {
      return privateCounter;
    }
  };   
})();

alert(counter.value()); // 0
counter.increment();
counter.increment();
alert(counter.value()); // 2
counter.decrement();
alert(counter.value()); // 1

Thử nó

Trong ví dụ trên, increment(), decrement() và value() trở thành hàm công khai vì chúng được bao gồm trong đối tượng trả về, trong khi hàm changeBy() trở thành hàm riêng vì nó không được trả về và chỉ được sử dụng nội bộ bởi increment() và

Các bao đóng được triển khai như thế nào trong JavaScript?

Đóng cửa trong JavaScript Mcq là gì?

Tại sao nó được gọi là đóng cửa?

Đóng cửa trong các câu hỏi phỏng vấn JavaScript là gì?