Область видимости в Javascript

Область видимости определяет доступность (видимость) переменных.

В JavaScript существует два типа области видимости:

  • локальная
  • глобальная

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

Локальные переменные JavaScript

Переменные, декларированные внутри JavaScript функции, становятся ЛОКАЛЬНЫМИ по отношению к этой функции.

У локальных переменных локальная область видимости: получить доступ к ним можно только внутри конкретной функции.

Пример:


// расположенный здесь код не может использовать переменную carName

function myFunction() {
     var carName = "Volvo";

     // расположенный здесь код может использовать переменную carName

} 

Так как локальные переменные доступны только внутри своих функций, в разных функциях допустимо использовать переменные с одинаковыми именами.

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

Глобальные переменные JavaScript

Переменные, декларированные за пределами JavaScript функций, становятся ГЛОБАЛЬНЫМИ.

У глобальных переменных глобальная область видимости: все скрипты и функции на данной веб-странице могут получить к ним доступ.

Пример:


var carName = " Volvo";

 // расположенный здесь код может использовать переменную carName

function myFunction() {

     // расположенный здесь код может использовать переменную carName

} 

Внимание! В JavaScript объекты и функции также являются переменными.

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

Автоматическая глобальная область видимости

Если вы присваиваете значение переменной, которая ранее не была декларирована, то эта переменная автоматически становится глобальной.

В следующем примере декларируется глобальная переменная carName, хотя значение ей присваивается внутри функции:


myFunction();

// расположенный здесь код может использовать переменную carName

function myFunction() {
     carName = "Volvo";
}

"Строгий" режим

Все современные браузеры поддерживают работу JavaScript в, так называемом, "строгом режиме".

В следующих главах данного учебника будет подробнее рассказано о том, что такое "строгий режим" и как его использовать.

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

Глобальные переменные в HTML

Для JavaScript глобальной областью видимости является все окружение JavaScript.

В HTML глобальная область видимости это окно браузера (объект window). Все глобальные переменные принадлежат объекту window.

Пример:


var carName = "Volvo";

// расположенный здесь код может для доступа к переменной carName
// может использовать выражение window.carName
 

Предупреждение

Не создавайте глобальные переменные, если в этом нет жесткой необходимости.

Ваши глобальные переменные (или функции) могут переписывать переменные (или функции) глобального объекта window. В свою очередь любая функция, включая объект window, может переписывать ваши глобальные переменные и функции.

Жизненный цикл переменных JavaScript

Жизненный цикл переменной JavaScript начинается во время ее декларирования.

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

Глобальные переменные в браузере прекращают свое существование, когда вы закрываете окно браузера (или вкладку страницы), однако они остаются доступными, если в то же окно загружается новая веб-страница.

Аргументы функций

Аргументы (параметры) функции работают как локальные переменные внутри функции.