Введение
Закрытие — это, пожалуй, самая важная часть javascript для понимания, как только вы поймете это, все остальное встанет на свои места.
Закрытие часто используется в :
-
Сохранение данных с объектами про-уровневые функции, такие как once, позволяющие запускать функцию только один раз.
-
обработчики событий в асинхронном javascript, о котором я расскажу в другой статье.
-
Используйте закрытие, чтобы скрыть функциональность, с которой вы обычно не хотите, чтобы люди возились.
Как это работает?
Проще говоря, когда вы возвращаете функцию (из другого вызова функции) в JavaScript, вы также возвращаете с ней «рюкзак» сохраненных данных (часть локальной памяти контекста выполнения родительской функции, которую использует возвращаемая функция).
Подождите минутку, возврат функции? Контекст выполнения? Функция с рюкзаком?
Не волнуйтесь, мы ответим на все эти и другие вопросы ниже.
Контекст выполнения
Когда вызывается функция, интерпретатор JavaScript запускает то, что можно назвать «подпрограммой», которая имеет собственное состояние (память), где хранятся локально определенные переменные и переданные аргументы, и собственный поток выполнения (метод, который javascript использует для интерпретации кода, проходя через него строка за строкой), где находятся инструкции (код), специфичные для функции.
Например, посмотрите на следующий блок кода
const myLibrary = [];
function isLibraryEmpty(library) {
const length = library.length;
length < 0 ? console.log("library is empty") : console.log("library is not empty") ;
};
isLibraryEmpty(myLibrary);
В строке 6 вызывается функция, которая запускает создание совершенно нового контекста выполнения для нее в процессе выполнения кода, который будет иметь свое собственное локальное состояние (как в локальной памяти)
в котором будет храниться следующее:
- библиотека : myLibrary
- длина : 0 (так как массив пуст)
затем будет выполнена проверка условия, которая приведет к выводу на консоль сообщения «library is not empty» с последующим удалением контекста выполнения, включая все его локальное состояние.
Возврат функции из другой функции
Для большей наглядности рассмотрим модифицированную версию нашего предыдущего примера:
const myLibrary = [];
function isLibraryEmpty(library) {
const length = library.length;
return function checker(length) {length < 0 ? console.log("library is empty") : console.log("library is not empty") ; }
};
const newfunc = isLibraryEmpty(myLibrary);
newfunc()//"library is empty"
С помощью const newfunc = isLibraryEmpty(myLibrary) контекст выполнения isLibraryEmpty будет запущен, возвращая в newfunc функцию, которая проверяет, является ли массив myLibrary пустым или нет, после чего вся локальная память, хранящаяся в контексте выполнения, будет удалена.
Если вы выполните следующий код, но добавите в строку 6 myLibrary.push("test"), вы заметите, что консоль выдает сообщение о том, что библиотека больше не пуста.
Но подождите! Как он мог это сделать, если мы точно установили, что контекст выполнения isLibraryEmpty был удален, а значит, вся локальная память также была удалена? Как могла длина увеличиться до 1, зная это?
Что значит иметь закрытость?
Продолжая предыдущий раздел, правда в том, что когда мы вернули функцию, мы вернули вместе с ней то, что можно назвать рюкзаком, который содержит некоторые важные данные, необходимые возвращаемой функции для работы, другими словами, эти данные являются постоянными, это не те данные, которые были удалены в контексте выполнения isLibraryEmpty, это копия или ссылка на эти данные.
Только функция newfunc имеет доступ к этому рюкзаку, данные в нем лексически скопированы.
Техническими словами, функция при возврате принесла с собой P.L.S.R.D (Persistant Lexically Scoped Referenced Data), также известную как закрытие, как показано на рисунке ниже.
Обзор
Подводя итог, закрытие — это функция javascript, которая позволяет нам возвращать лексически скопированные данные из локальной памяти вызванной функции вместе с возвращенной функцией X, так что X может работать без каких-либо ошибок или проблем.