С возвращением в Confusion: Part 2. Я имею в виду Scopes & Closures: Part 2. Если вы пропустили первую часть, где я говорил об областях, вы можете найти ее здесь.

В этой части я остановлюсь на закрытии! Закрытие может быть пугающей и пугающей темой. Вы только посмотрите, как это определяет MDN:

Замыкание - это сочетание функции, объединенной (заключенной), со ссылками на ее окружающее состояние (лексическое окружение).

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

Упрощенное определение замыкания

Замыкание относится к функции, в которой внутренняя функция имеет доступ к переменным во внешней области функции даже после того, как она уже была выполнена. Каждый раз, когда функция создается в JavaScript, также создается закрытие.

У закрытия есть три области действия:

  • Local Scope - доступ к собственным переменным.
  • Объем родительской функции - доступ к переменным с помощью внешней функции.
  • Global Scope - доступ к глобальным переменным.

Давайте посмотрим внимательнее

Вот простой пример.

Здесь у нас есть родительская функция, которая содержит определенную переменную name. Это также создает внутреннюю функцию.

Внутренняя функция имеет локальную переменную greeting . Внутренняя функция может получить доступ к переменной в родительской функции, поэтому она может выводить ее в консоль.

Авария

В строке 12 внешняя функция вызывается впервые. Давайте посмотрим, что здесь происходит, начиная с самого верха:

  1. Создается переменная name со значением «Селена».
  2. Внутренняя функция объявляется и возвращается в строке 5.
  3. Содержимое внутренней функции хранится в переменной greet.
  4. После сохранения внешняя функция завершает выполнение, и ее область действия больше не существует. (Локальные переменные существуют только на время своей функции). После возврата из функции все локальные переменные удаляются.
  5. Однако при вызове greet переменная name по-прежнему доступна и используется. Вот почему наш результат - «Привет, Селена».

Как? Закрытие! Внутренняя функция создается при вызове внешней функции. На этом этапе образуется закрытие.

Вернемся к определению MDN.

Замыкание - это комбинация функции и ее лексической среды или ссылок на ее окружающее состояние.

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

И в этом сила закрытия!

Заключение

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

Источники

MDN - Закрытия

Замыкания в JavaScript с примерами