March 18, 2023

Как работает замыкание в JavaScript

В языке программирования JavaScript замыкание (closure) представляет собой особенный механизм обработки области видимости. Используя замыкания в коде, можно сохранять переменные в специальном контексте, который будет связан с текущей функцией.

Теперь посмотрим на пример из кода:

function counter() {
  let count = 0;
  return function() {
    count++;
    console.log(count);
  }
}

const increaseCount = counter();
increaseCount(); // 1
increaseCount(); // 2
increaseCount(); // 3

Вызов функции counter() создает новый контекст выполнения и устанавливает значение count на 0. Функция затем возвращает другую функцию, в которой мы увеличиваем значение переменной count и выводим ее текущее значение в консоль.

Когда мы вызываем counter() и присваиваем результат переменной increaseCount, мы сохраняем состояние count для последующих вызовов increaseCount(). Несмотря на то, что переменная count существует только внутри функции counter(), она все еще доступна через замыкание при каждом последующем вызове increaseCount().

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

function person(name, age) {
  let privateAge = age;
  return {
    getName() {
      return name;
    },
    getAge() {
      return privateAge;
    },
    increaseAge() {
      privateAge++;
    }
  }
}

const john = person('John', 30);

console.log(john.getName()); // "John"
console.log(john.getAge()); // 30

john.increaseAge();
console.log(john.getAge()); // 31

Здесь мы создаем объект person, который хранит приватную переменную privateAge. Методы getName() и getAge() возвращают публичные свойства name и privateAge. Метод increaseAge() увеличивает значение переменной privateAge.

Мы создаем новый объект john с помощью функции person(), передавая имя и возраст. Мы можем получить доступ к имени и возрасту, вызывая методы get, и увеличить возраст, вызывая метод increaseAge().

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

#JavaScript #Reactjs #замыкание #closure