Доброго времени суток, друзья. Сегодня расскажу о замыканиях (Closures)в языке JavaScript на показательных примерах.
Начнем издалека. В арсенале Javascript присутствует понятие Scope (контекстов) - это зона видимости переменных в коде. Примером может служить функция с объявленной внутри переменной, к которой нельзя обратиться вне этой функции. Проведем параллель с файловой системой: существует папка с файлом, этот файл не виден вне папки, потому что у нее собственный scope.
Замыкания. Создадим функцию createFunction. Внутри инициализируем переменную и еще одну функцию. Переменную назовем yourName со значением по умолчанию ("Victor"), а затем создадим вторую функцию с названием showYourName.
function createFunction() {
const yourName = 'Victor';
function showYourName() {
alert(yourName);
};
return showYourName;
};
Здесь внешняя функция createFunction хранит переменную и возвращает внутреннюю функцию. Вторая (внутренняя) функция будет выводить предупреждение со значением yourName. Теперь используем наше замыкание.
let saveBox = createFunction();
saveBox();
В результате выполнения кода увидим предупреждение с текстом "Victor".Как оно работает: JavaScript после вызова createFunction сохранил контекст вызова функции, т.е. сохранил ссылки на переменные,которые оказались доступны на момент вызова, чтобы они затем могли быть использованы при вызове saveBox. Это — замыкание. Данный функционал используется, когда нужно связать данные с функцией, которая обработает их позднее:
function sumNumbers(x) {
function another(y) {
return x + y;
};
return another;
};
let sumWithOne = sumNumbers(1);
console.log(sumWithOne(2)); // 3
Материал подготовлен специально для издания "Я - программист":
Автор: Виктор Рябков - Junior Fullstack Developer в Firefly labs
Редактор: Наконечный Павел
Копирование и цитирование материалов разрешено только с указанием активной гиперссылки на источник.
