Ресурсы: Статья про замыкания Статья из учебника Объект функции Лексическое окружение
Разберем пример, не забываем, что код выполняется построчно, строка за строкой:
Код
let number = 5;
function logNumber() {
console.log(number); // здесь выводится именно актуальное значение number
}
number = 6;
logNumber(); // 6
В JavaScript у каждой выполняемой функции, блока кода и скрипта есть связанный с ними внутренний технический (скрытый) объект, называемый
лексическое окружение, мы его просто так не можем увидеть.
Лексическое окружение, в свою очередь, делится на две части:
внутреннее и внешнее Если немного изменить ранее написанный код, добавив внутрь функции объявление переменной с таким же именем, но другим значением, то результат работы функции будет другой:
Код
let number = 5;
function logNumber() {
let number = 4;
console.log(number);
}
number = 6;
logNumber(); // 4
Функция сначала пытается найти что-то внутри себя, и только если не находит, ищет уровнем выше.
Цитата
Внутреннее лексическое окружение - это объект, в котором как свойства хранятся все локальные переменные этой функции.
Каждый вызов функции - это создание нового лексического окружения со своими специфичными для этого вызова локальными переменными и параметрами.
Функции со счётчиками
Код
function createCounter() {
let counter = 0;
const myFunction = function () {
counter = counter + 1;
return counter;
};
return myFunction;
}
const increment = createCounter();
В переменной
increment сохраняется результат вызова функции
createCounter, а это возвращаемая функция
myFunction То есть, после выполнения функции
createCounter, в переменной
increment будет сохранён такой код:
Код
function() {
counter = counter + 1;
return counter;
};
По сути, переменная
increment стала функцией, и теперь мы её можем вызывать
Код
function createCounter() {
let counter = 0;
const myFunction = function () {
counter = counter + 1;
return counter;
};
return myFunction;
}
const increment = createCounter();
const c1 = increment();
const c2 = increment();
const c3 = increment();
console.log(c1, c2, c3); // 1 2 3
Добавлять комментарии могут только зарегистрированные пользователи.
