Замыкания в JavaScript

08.01.2020

Если вы уже объявили функцию в JavaScript, значит вы уже знакомы с замыканиями. Когда функция вызывается, она выполняется в области видимости, где она была объявлена, а не где была вызвана. Под областью видимости следует понимать, набор переменных и возможность достуа к ним. Другими словами функция помнит переменные к которым она имеет доступ. Разберемся с этим с помощью примера.

const bark = dog => {
	const say = `${dog} barked!`;
	(() => console.log(say))();
};

bark("Roger"); // -> Roger barked

Данный пример выведет в консоль сообщение: “Roger barked!".

Давайте немного переделаем наш пример.

const prepareBark = dog => {
	const say = `${dog} barked!`;
	return () => console.log(say);
};

const bark = prepareBark("Roger"); 
bark(); // -> Roger barked

В переделанной примере в консоль так же будет выведено “Roger barked!".

Теперь мы создадим две функции для разных собак.

const prepareBark = dog => {
	const say = `${dog} barked!`;
	return () => console.log(say);
};

const barkRoger = prepareBark("Roger");
const barkJessy = prepareBark("Jessy"); 
barkRoger(); // -> Roger barked
barkJessy(); // -> Jessy barked

В результате в консоль будет выведено:

Roger barked!
Jessy barked!

В результате вы можете заметить что значение переменной say привязано к функции, которая возвращается из функции prepareBark(). Кроме этого, обратите внимание, что повторный вызов функции prepareBark(), никак не повлиял на область видимости и переменные первой функций, полученной из метода prepareBark().

Так работают замыкания. Функция, которая была возвращена, сохраняет свою оригинальную область видимости.

#jsbook#javascript

Еженедельная рассылка новостей

Асинхронное программирование в JavaScript

Классы в JavaScript