Понимание основ работы области видимости в JavaScript избавит вас от головной боли, времени и ошибок в будущем.
Поговорим об объявлениях переменных. Var, let и const. Какая разница? Если вы относитесь к ним, как к гороху и бобам гарбанзо, то пора изменить свой образ жизни. Давайте вместе рассмотрим различия.
Var и Let
До ES6 у JavaScript были только функции и глобальная область видимости. Это означало, что переменная, объявленная внутри функции, жила внутри функции, а переменная, объявленная вне функции, могла существовать где угодно. Это означает, что переменные, объявленные внутри операторов if или других блоков кода, имеют глобальную область видимости и живут за пределами своего блока кода. Вот так:
Как вы понимаете, это может вызвать проблемы в наших проектах.
В ES6 JavaScript представил ключевое слово let и область видимости блока. Область действия блока означает, что если переменная объявлена с помощью let или const в блоке кода, она живет только в этом блоке кода. Это изменяет наш пример, чтобы он выглядел так:
В строке 20 объявляется и инициализируется новая переменная, также называемая dog, но она умирает, как только завершается оператор if. В строке 24 журнал консоли ссылается на первую переменную dog, объявленную и инициализированную в строке 16. Таким образом, возвращается Fido not Argo.
Вот более простой фрагмент, иллюстрирующий области действия var, let и const бок о бок.
Совет: если у вас возникли проблемы с сохранением прямых букв let и var, запомните эти фразы: «var уходит далеко» и «выпустите меня».
Резюме:
Позволять
- Блокировать
Const
- Блокировать
Вар
- Область действия функции
Если вам понравилась эта статья, хлопните в ладоши и ознакомьтесь с моей статьей о понимании подъема в JavaScript, чтобы углубить ваше понимание области действия JavaScript.
