Подойдите ближе к Closure в JavaScript
Чем больше вы знакомы с основами JavaScript, тем дальше вы от кодов, подверженных ошибкам. А Замыкание — одна из самых рудиментарных концепций, которая может стать для вас кошмаром. Но не волнуйтесь; призрак больше не сможет преследовать вас после этого.
Замыкание в JavaScript — это внутренняя функция, которая имеет доступ к членам внешней функции. Таким образом, наряду со своей собственной областью действия и членами глобальной области видимости, он также может получить доступ к своей цепочке областей действия родительской функции. Замыкания широко используются для обеспечения конфиденциальности данных объекта, функций обратного вызова и в обработчиках событий.
Пример:
Вывод:
Ссылаясь на фрагмент кода в примере 1, можно увидеть, что доступ к переменным preMsgText и postMsgText внешней функции greetingMessage осуществляется внутри внутренней функции showGreeting. Функция showGreeting называется замыканием.
Здесь мы кратко обсудили, что такое замыкание и как его можно определить простым способом. Теперь давайте поговорим о его практических вариантах использования и о том, почему это так важно в JavaScript. Чтобы понять это, вы должны внимательно взглянуть на приведенный ниже фрагмент кода.
Вывод:
В примере 2, объявив preMsgText и postMsgText внутри функции greetingMessage, мы сделали их закрытыми переменными, доступ к которым возможен только внутри функции. и снаружи через некоторую функцию-член (геттер или сеттер) той же цепочки областей видимости. Теперь, с другой стороны, мы установили функции showGreeting и setGreetingMessage в качестве общедоступных членов, предоставив их в возвращаемом объекте. Эти две функции теперь могут обращаться к preMsgText и postMsgText извне.
Это одна из популярных функций объектно-ориентированного программирования (ООП), помогающая скрывать данные.
Пока все просто. Правильно? Теперь давайте разберем его призрачную часть и проблемы, с которыми можно столкнуться. См. приведенный ниже код.
Возможно, вы ожидаете следующего вывода:
Но, к сожалению, он напечатает это-
Вы нашли что-нибудь сомнительное в примере 3? При отладке кода вы увидите, что значение i отображается правильно при возврате. Однако в конце все переменные объектов имеют одинаковое значение. Причина в том, что внутренняя функция имеет доступ к переменным внешней функции по ссылке. Таким образом, каждый раз возвращается ссылка i, а не фактическое значение i. И когда мы вызываем функцию regNo извне, значение i становится равным 3.
Теперь вопрос в том, как мы можем преодолеть это. Одним из лучших решений является использование выражения немедленно вызываемой функции (IIFE) следующим образом.