Объясните область видимости и цепочку областей видимости в JavaScript

В этой статье мы попытаемся понять, что такое область действия переменной, а также ее функция (или метод). Мы увидим, что такое Scope Chain, на некоторых примерах кодирования.

Давайте сначала посмотрим на следующий раздел, в котором описываются области видимости.

Сфера:

• Область действия в JavaScript фактически определяет доступность переменных и функций в различных частях собственного кода или программы.
• Другими словами, Scope поможет нам определить данную часть кода или программы, к каким переменным или функциям можно получить доступ, а к каким переменным или функциям нельзя получить доступ.
• Внутри самой области можно было получить доступ к переменной, функции или методу. Доступ к данным вне указанной области действия переменной или функции невозможен.
• В JavaScript доступно три типа областей: глобальная область, локальная область/область функции и блочная область. Давайте попробуем кратко понять каждый из них в следующем разделе.

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

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

Пример 1: В этом примере мы будем объявлять глобальную переменную, которую будем использовать в более поздней части нашего кода. Мы будем вызывать эту переменную в одной функции. Мы вызовем эту функцию внутри другой функции, а затем вызовем эту другую функцию, чтобы увидеть результат.

Выход:

GeeksforGeeks

Локальная или функциональная область:

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

Пример 2: В этом примере мы объявим основную функцию, которая будет состоять из локальной/функциональной переменной. Мы объявим вложенную функцию, которая будет учитывать эту переменную и выполнять над ней операцию умножения. Мы будем вызывать вложенную функцию внутри самой основной функции, а затем основную функцию вне ее объявления.

Затем, наконец, мы вызовем нашу локальную/функциональную переменную вместе с локальной/функциональной функцией, чтобы увидеть, какой вывод они отобразят при вызове.

Выход:

10
undefined
Uncaught ReferenceError: a is not defined

Объем блока:

• Область действия блока связана с переменными или функциями, объявленными с помощью let и const, поскольку var не имеет области действия блока.
• Область действия блока сообщает нам, что к переменным, объявленным внутри блока { }, можно получить доступ только внутри этого блока, а не за его пределами.

Пример 3: В этом примере мы объявим блок с помощью фигурных скобок «{}», а внутри этого блока мы объявим переменную, имеющую в ней определенное значение. Мы будем вызывать эту переменную за пределами заблокированной области, чтобы увидеть, какие выходные данные она на самом деле отображает при вызове.

Выход:

Uncaught ReferenceError: x is not defined

Цепочка прицелов :

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

Пример 4: В этом примере мы сначала объявим глобальную переменную области видимости, которую будем использовать в более поздней части кода, а затем мы объявим основную функцию, внутри которой мы будем делать некоторые вещи. Мы объявим еще одну локальную/функциональную переменную внутри этой основной функции, и сразу после этого мы объявим две вложенные функции (имеющие локальную/функциональную область видимости) внутри самой основной функции.

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

Выход:

30
20