Понимание замыканий JavaScript: руководство для начинающих

Начинающим разработчикам идея замыканий в JavaScript может быть трудна для понимания . Тем не менее, они являются важнейшим компонентом языка и могут значительно улучшить ваши навыки программирования. В этом посте мы разоблачим замыкания, объясним, почему они важны, и предоставим вам четкие примеры кода, которые помогут вам разобраться.

Замыкание - это что?

Замыкание в JavaScript состоит из лексического контекста, в котором была объявлена функция, а также из самой функции. Другими словами, замыкание позволяет функции получать доступ к переменным из ее внешней области видимости даже после завершения выполнения внешней функции. Он "закрывает" переменные, которые ему требуются в практическом смысле, отсюда и название "закрытие".

Выполнение замыкания: мы определяем функцию внутри другой функции, затем возвращаем. Внутренняя функция сохранит ссылку на переменные и параметры \nего внешняя функция, даже если внешняя функция завершила выполнение. Давайте проиллюстрируем это примером:

function outerFunction() {
  let outerVariable = 'I am from the outer function';

  function innerFunction() {
    console.log(outerVariable);
  }

  return innerFunction;
}

const closureExample = outerFunction();
closureExample(); // Output: I am from the outer function

В приведенном выше коде outerFunction определяет переменную outerVariable и внутреннюю функцию innerFunction. Функция innerFunction регистрирует значение outerVariable в консоли. Наконец, мы присваиваем возвращаемую внутреннюю функцию переменной с именем closureExample и вызываем ее.

Когда вызывается функция closureExample(), она получает доступ и выводит значение outerVariable, даже если outerFunction уже завершила выполнение. Такое поведение становится возможным благодаря замыканию, которое сохраняет ссылку на outerVariable из лексической среды outerFunction. Преимущества замыканий:

Замыкания обладают рядом преимуществ, в том числе:

Инкапсуляция: Закрытие\nures позволяют создавать частные переменные и функции, поскольку переменные внутри внешней функции недоступны извне.

function counter() {
  let count = 0;

  return function () {
    count++;
    console.log(count);
  };
}

const increment = counter();
increment(); // Output: 1
increment(); // Output: 2

В этом примере функция counter возвращает внутреннюю функцию, которая увеличивает и регистрирует переменную count. Переменная count недоступна извне замыкания, обеспечивая инкапсуляцию и конфиденциальность данных.

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

function messageLogger(message) {
  return function () {
    console.log(message);
  };
}

const logHello = messageLogger('Hello');
logHello(); // Output: Hello

const logGoodbye = messageLogger('Goodbye');
logGoodbye(); // Output: Goodbye

Здесь функция messageLogger возвращает внутреннюю функцию, которая регистрирует предоставленное сообщение. Каждое закрытие c\nсвязанный с messageLogger сохраняет значение message, позволяя нескольким независимым регистраторам сохранять свои собственные уникальные сообщения.

Вывод:

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