Объем
Область действия – это набор правил, управляющих разрешением ссылок на переменные. Область действия связана с видимостью переменных в вашем коде — она определяет, где и какая переменная может использоваться. Каждая область может «заглядывать» в окружающую ее область. Область действия является статической и содержит фиксированный набор переменных, доступных в момент и в месте, где вы определяете функцию.
Области действия похожи на ведра, а переменные — на шарики, которые вы кладете в эти ведра.— Вы еще не знаете JS
JavaScript знает три типа области действия: глобальная область действия, область действия функции, область действия блока.
Глобальная область — это область, которая содержит все остальные области и отображается в них.
До ES6 область действия была единственной формой области действия в JavaScript; все объявления переменных и функций следовали правилам области действия функции. Область действия блока была введена в ES6 и используется только переменными, объявленными с помощью новых ключевых слов объявления переменных let и const.
Область действия в JavaScript создается внутри функций. При объявлении функции внутри тела этой функции создается новый блок области видимости. Доступ к переменным, объявленным внутри новой области действия функции, невозможен из родительской области; однако область функции имеет доступ к переменным в родительской области.
Родительская область — это блок кода, в котором определена функция. Это не блок кода, в котором вызывается функция.
Чтобы создать переменную с областью действия функции, мы должны объявить переменную с помощью ключевого слова var
.
Область действия блока в JavaScript создается с помощью фигурных скобок ({}
). Пара фигурных скобок может быть помещена в любом месте кода, чтобы определить новый блок области видимости. Операторы if, циклы, функции и любые другие пары фигурных скобок будут иметь собственную область действия блока. Сюда входят плавающие фигурные скобки, не связанные с ключевым словом (if, for и т. д.).
Подъем
Подъем JavaScript – это процесс, при котором интерпретатор перемещает объявление функций, переменных или классов в верхнюю часть их области видимости перед выполнением кода.
Вы можете думать о подъеме как о функции, основанной на двух «этапах» выполнения кода:
- Этап компиляции (где также анализируется код)
- Этап выполнения (затем выполняется код)
JavaScript выделяет память для всех переменных и функций, определенных в программе перед выполнением. И JavaScript поднимает только объявления, а не инициализации.
Декларация –› Инициализация/Назначение –› Использование
Подробнее:
Привязки
Чтобы перехватывать и удерживать значения, JavaScript предоставляет вещь, называемую привязкой или переменной.
let myName = “Joe”
В этом предложении ключевое слово let
указывает, что мы собираемся определить привязку. За ним следует имя привязки и, если мы хотим сразу присвоить ему значение, оператор =
и выражение. Эта привязка называется (имя привязки)myName
и используется для захвата и удержания строки Joe
. Привязки не содержат значения, они захватывают их.
После определения привязки ее имя можно использовать в качестве выражения.
Если мы определим привязку, не давая ей значения, то нечего захватывать, поэтому мы получим значение undefined
.
Системы JavaScript всегда добавляют в вашу среду ряд полезных стандартных привязок, например: alert()
, console.log()
Каждая привязка имеет область, которая является частью программы, в которой привязка видна. Переменная или привязка могут использоваться только в своей области и любой вложенной области.
Для привязок, определенных вне какой-либо функции или блока, областью действия является вся программа — вы можете ссылаться на такие привязки, где хотите. Они называются глобальными.
Но на привязки, созданные для параметров функции или объявленные внутри функции, можно ссылаться только в этой функции, поэтому они называются локальными привязками.
Подробнее:
var, пусть и const
Базовый JavaScript использует ключевое слово var
для объявления переменных и
ECMAScript 6 (ES6/ES2015) представил ключевые слова let
и const
, которые поддерживают объявление локальных переменных области блока. Это означает, что переменная будет ограничена областью действия блока, в котором она определена, например, операторif
или цикл for
, и не будет доступна за пределами открывающей и закрывающей фигурных скобок блока. .
Это противоречит объявлениям var
, которые доступны вне блоков, в которых они определены.
Разница между let
и const
заключается в том, что объявление const, как следует из названия, является константой — доступной только для чтения ссылкой на значение. Это не означает, что значение неизменно, просто идентификатор переменной нельзя переназначить.
Примечание. Поскольку поднятую переменную, объявленную с помощью var
, можно использовать до того, как она будет объявлена, мы должны быть осторожны, чтобы не использовать эту переменную до того, как ей будет присвоено значение. Если доступ к переменной осуществляется до того, как ей было присвоено значение, она вернет значение как undefined
, что может вызвать проблемы, особенно если переменные используются в глобальной области видимости.
Источники и многое другое:
Временная мертвая зона (TDZ)
Временная мертвая зона (TDZ) — это термин, описывающий состояние, в котором переменные недоступны. Они есть в области видимости, но не объявлены. И получаем ReferenceError
. Переменные, объявленные let
или const
, имеют TDZ.
Переменные, объявленные с ключевыми словами let
и const
, имеют блочную область видимости. Когда переменная объявляется с областью действия блока, она НЕ имеет такого же подъема переменной, как переменные, созданные в области действия функции. Переменные с блочной областью не поднимаются в верхнюю часть области, и поэтому к ним нельзя получить доступ, пока они не будут объявлены. Это означает, что переменные, созданные с блочной областью, подчиняются временной мертвой зоне ( ТДЗ). TDZ — это период между вводом области действия и объявлением переменной. Он заканчивается, когда переменная объявляется, а не присваивается.
Если доступ к переменной осуществляется внутри временной мертвой зоны, будет выдана ошибка времени выполнения. Это важно, потому что позволяет построить более надежный код с меньшим количеством семантических ошибок, возникающих при объявлении переменных.
Давайте рассмотрим пример:
Если мы запустим этот код, мы получим ReferenceError
. Почему? Когда мы объявляем переменную const x = 5
в области блока {}
, мы создаем TDZ для x
, который мы используем в console.log(x)
Больше примеров вы можете найти здесь.
Глобальный объект
Давайте рассмотрим один пример:
ES6 ввел различие для глобального объекта JavaScript (window
в браузерах, global
в Node.js):
- Все свойства глобального объекта являются глобальными переменными. В глобальной области следующие объявления создают такие свойства: объявления
var
, объявления функций - Но теперь есть и глобальные переменные, которые не являются свойствами глобального объекта. В глобальной области следующие объявления создают такие переменные: объявления
let
иconst
, объявленияclass
Окружения для различных переменных образуют следующую цепочку:
Module variables → Global variables → Global object
Объявления функций и объявления классов
Объявления функций:
- имеют блочную область видимости, например let.
- создавать свойства в глобальном объекте (находясь в глобальной области видимости), например var.
- подняты: независимо от того, где объявление функции упоминается в его области видимости, оно всегда создается в начале области видимости.
Объявления классов:
- имеют блочную область видимости.
- не создавайте свойства для глобального объекта.
- не поднимаются.