Понятие Scope в отношении JavaScript может быть немного сложным для понимания новичком-разработчиком. Давайте углубимся в эту концепцию для более глубокого изучения.

Сфера

В JavaScript есть два типа «области видимости», с которыми вы столкнетесь. Существует глобальнаяобласть действия и локальная область действия. Эти области действия по отношению к переменной будут определяться расположением объявления переменной.

Глобальный охват

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

  • «b» доступен из локальной области действия функции из-за того, что «b» имеет глобальную область видимости.

  • Также важно отметить, что переменные, объявленные без (var, const или let), имеют глобальную область действия.

Местный охват

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

  • «b» недоступен за пределами его локальной области видимости.

  • «b» доступен для функции «nestedFunc» через цепочку областей видимости или так называемую «лексическую область видимости». Вложенная функция имеет доступ ко всем переменным, которые объявлены в локальной области родительских функций и так далее по цепочке областей видимости до глобальной области.

  • В этом примере у нас есть два отдельных объявления переменной «b», а в предыдущем примере мы записывали значение из родительской области. Вложенная функция всегда будет проверять локальный экземпляр переменной, на которую мы ссылаемся, и если она не найдет то, что ищет в своей текущей области видимости, она будет двигаться вверх по цепочке областей видимости, пока не найдет или не выдаст ошибку.

  • Здесь «b» локально привязан к функции «nestedScope». Мы не можем получить к нему доступ из родительской функции «scope», цепочка областей действия не работает сверху вниз.

До сих пор мы рассматривали локальную область видимости с точки зрения области действия функции. В сценарии ECMA 6 (ES6) была введена концепция области блока вместе с новыми ключевыми словами объявления переменных const и let.

Область блокировки

Область действия блока определяется в циклах for/while и операторах if/switch. const и let — единственные ключевые слова объявления переменных, которые поддерживают локальную область видимости, как указано в приведенном ниже коде.

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