«Вы не знаете JS: Scope & Closures» Кайла Симпсона — важное руководство для программистов на JavaScript, которые хотят лучше понять сложности области действия и замыканий. Эта книга является второй книгой из серии книг «Вы еще не знаете JS». Я рекомендую сначала прочитать «Вы не знаете JS: Up & Going», чтобы у вас было базовое представление о JS.

Следующее резюме представляет собой обзор основных концепций и идей книги, предлагая ценную информацию о JavaScript.

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

Замыкания, с другой стороны, — это мощная функция JavaScript, которая позволяет функциям запоминать и получать доступ к переменным в своей области видимости даже после того, как они покинули эту область. Это особенно полезно при работе с обратными вызовами, обработчиками событий или в других ситуациях, когда выполнение функции задерживается.

Лексическая область

Лексическая область видимости — это основная концепция правил области видимости JavaScript. Он устанавливается во время компиляции, что означает, что область действия переменной определяется ее положением в исходном коде. Область действия и область действия блока — это два способа создания новой области видимости в JavaScript. Переменные, объявленные внутри функции, являются локальными для этой функции и недоступны снаружи. С введением ES6 JavaScript поддерживает ключевые слова let и const для определения области блока, что позволяет более точно контролировать видимость переменных, что приводит к более чистому и удобному в сопровождении коду.

Возьмем следующий пример:

if (true) {
	const foo = "foo";
	console.log(foo); // "foo"
}

Оператор if вводит область действия блока с помощью оператора блока. Мы говорим, что foo ограничена оператором if. Это означает, что к нему можно получить доступ только из этого блока.

Если мы попытаемся получить доступ к foo за пределами блока, мы получим ReferenceError, потому что он выходит за рамки:

if (true) {
	const foo = "foo";
	console.log(foo); // "foo"
}
console.log(foo); // Uncaught ReferenceError: foo is not defined

Поднятие
Поднятие — это поведение в JavaScript, при котором объявления переменных и функций перемещаются в верхнюю часть соответствующих областей во время компиляции. Это может быть полезно для использования переменных и функций до того, как они будут объявлены в вашем коде. Однако подъем может привести к неожиданному поведению, если вы попытаетесь получить доступ к переменной до того, как ей было присвоено значение. Переменные, объявленные с помощью let и const, не поднимаются, и попытка доступа к ним до их объявления приводит к ошибке ReferenceError.

Оба следующих кода дадут одинаковый результат из-за подъема:

x = 5; // Assign 5 to x

elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x;                     // Display x in the element

var x; // Declare x
var x; // Declare x
x = 5; // Assign 5 to x

elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x;

Выражение немедленно вызываемой функции

IIFE — это функциональное выражение, которое определяется и вызывается сразу после его создания. Это создает новую область и запускает функцию в этой области, эффективно изолируя переменные функции от глобальной области. Это полезный метод, позволяющий избежать загрязнения глобального пространства имен и управлять временем жизни переменных.

Замыкание
Замыкание — это ключевое понятие в JavaScript, которое позволяет функциям «запоминать» свое лексическое окружение. Когда функция определена внутри другой функции, эта функция имеет доступ к переменным внешней функции. Этот доступ сохраняется даже после завершения выполнения внешней функции, поэтому внутренняя функция может продолжать использовать эти переменные. Замыкания обычно используются в JavaScript для таких задач, как реализация закрытых переменных и инкапсуляция, создание фабрик функций и декораторов, а также работа с асинхронными обратными вызовами и обработчиками событий.

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

В целом книга You Don’t Know JS: My Scope & Closures дает исчерпывающее и глубокое представление об основных понятиях области действия и замыканий в JavaScript. Глубокое понимание этих концепций позволяет разработчикам писать более чистый, эффективный и удобный для сопровождения код. В книге также обсуждаются практические приложения и шаблоны проектирования, такие как IIFE, замыкания и различные модульные системы, что дает ценную информацию об использовании этих концепций в реальных проектах. Изучая темы, затронутые в книге, разработчики могут улучшить свои навыки и знания, что приведет к разработке более надежных и масштабируемых приложений. Эта книга с четкими пояснениями, практическими примерами и глубоким анализом ключевых понятий является обязательным ресурсом для всех, кто хочет углубить свое понимание внутренней работы JavaScript и вывести свои навыки программирования на новый уровень.

После этой книги во всей серии книг есть еще четыре книги, поэтому не стесняйтесь читать всю серию книг из этого источника.