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

В JavaScript переменные, объекты и функции могут иметь глобальную область действия, область действия модуля, область действия блока или область действия функции.

Глобальная область видимости в JavaScript

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

Например, объявление глобальной переменной в одном файле:

// index.js
пусть глобальная переменная = "некоторое значение"

Означает, что любой другой скрипт в вашей программе может получить к нему доступ:

// другой скрипт.js
приставка.log (глобальная переменная) // некоторое значение

Объявление переменных JavaScript в глобальном масштабе - плохая практика, поскольку это может привести к загрязнению пространства имен. Глобальное пространство имен — это верхнее пространство Javascript, которое содержит переменные, объекты и функции. В браузере он прикрепляется к

Окно объект, в то время как NodeJS использует объект с именем Глобальный.

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

Объем модуля

Модуль — это отдельный файл, который инкапсулирует и экспортирует фрагменты кода для использования другими модулями в проекте. Это позволяет более эффективно организовывать и поддерживать кодовую базу.

Модули ES формализованы шаблон модуля JavaScript в JavaScript в 2015 году.

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

Вы можете использовать переменную, объявленную в модуле вне его, только если модуль экспортирует эту переменную с помощью экспорт ключевое слово. Затем вы можете импортировать это имя в другой модуль, используя импорт ключевое слово.

Вот пример, который показывает экспорт класса:

// index.js
экспортучебный классФу{
конструктор(свойство_1, свойство_2) {
это.property_1 = свойство_1
это.property_2 = свойство_2
 }
}

А вот как вы можете импортировать этот модуль и использовать экспортируемое им свойство:

// некоторый модуль.js
импорт {Фу} из './index.js'
const bar = новый Foo('фу', 'бар')
приставка.log (bar.property_1) // фу

Файлы не объявлены как модули по умолчанию в JavaScript.

В клиентском JavaScript вы можете объявить скрипт как модуль, установив тип приписывать модуль на сценарий ярлык:

<тип скрипта="модуль" источник="index.js"></script>

В NodeJS вы можете объявить скрипт как модуль, установив тип собственность на модуль в твоей пакет.json файл:

{
"тип": "модуль"
}

Область блока

Блок в JavaScript — это место, где пара фигурных скобок начинается и заканчивается.

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

{ // Начало блока
 константа один = '1'
 пусть два = '2'
 переменная три = '3'
} // Конец блока
приставка.log (один) // выдает ошибку
приставка.log (три) // "3"

Переменные, заключенные в блок выше и объявленные как const или let, доступны только внутри блока. Однако вы можете получить доступ к переменной, объявленной с помощью вар ключевое слово вне блока.

Объем функций

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

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

Например:

функцияумножить() {
позволять один = 1
вар два = 2
константа три = 3
возвращаться раз два три
}
// Затенение переменных
константа три = 'три' // Не выдает ошибку

Понимание правил масштабирования жизненно важно

Знание доступных областей видимости в JavaScript поможет вам избежать ошибок. Попытка получить доступ к переменной, которая недоступна в определенной области, является источником ошибок.

Понимание области также включает в себя такие понятия, как глобальное загрязнение пространства имен, которое может сделать ваш код более подверженным ошибкам.