Skip to main content
Практика завдань

Область видимості в JavaScript: типи та принципи роботи

Що таке Область видимості?

Область видимості — це частина коду, де змінні та функції є доступними для використання. У JavaScript область видимості визначає, де ви можете звертатися до змінних, і відіграє ключову роль в управлінні пам'яттю та запобіганні конфліктам імен.


Типи Області видимості

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

  • Опис: Змінні, оголошені в глобальному контексті (поза всіма функціями та блоками), доступні в усьому коді.

  • Особливості:

  • Забруднює глобальне простір імен, що може призвести до конфліктів.

  • Використання глобальних змінних слід мінімізувати.

javascript
var globalVar = "Я глобальний"; // або let/const, оголошені поза функціями function showGlobal() { console.log(globalVar); // доступ до глобальної змінної }

Область видимості функції

  • Опис: Змінні, оголошені всередині функції, доступні лише всередині цієї функції.

  • Особливості:

  • Область видимості функції допомагає ізолювати змінні та уникати конфліктів між функціями.

  • Ключове слово var має область видимості функції.

javascript
function example() { var localVar = "Я локальний"; console.log(localVar); // доступно всередині функції } console.log(localVar); // ReferenceError: localVar не визначено

Блокова область видимості

  • Опис: Змінні, оголошені з let або const всередині блоку (наприклад, всередині фігурних дужок {}), доступні лише в цьому блоці.

  • Особливості:

  • Дозволяє обмежити область видимості змінних всередині умовних конструкцій, циклів та інших блоків.

  • Допомагає уникнути помилок, пов'язаних з повторним оголошенням змінних.

javascript
if (true) { let blockVar = "Я з блоковою областю видимості"; console.log(blockVar); // доступно всередині блоку } console.log(blockVar); // ReferenceError: blockVar не визначено

Особливості роботи області видимості

  • Лексична область видимості: У JavaScript область видимості визначається на етапі компіляції (лексично), а не під час виконання. Це означає, що вкладені функції мають доступ до змінних зовнішньої функції, навіть якщо викликаються поза їх батьківською функцією.
javascript
function outer() { let x = 10; function inner() { console.log(x); // x доступний тут завдяки лексичній області видимості } return inner; } const innerFunc = outer(); innerFunc(); // 10
  • Замикання: Замикання — це функція, яка "пам'ятає" свою лексичну область видимості, навіть коли виконується поза своєю оригінальною областю видимості. Це дозволяє функції використовувати змінні, оголошені в її зовнішньому середовищі.
javascript
function counter() { let count = 0; return function() { count++; console.log(count); }; } const increment = counter(); increment(); // 1 increment(); // 2

Важлива примітка:

Область видимості визначає, де змінні та функції доступні у вашому коді. Розуміння її принципів допомагає уникати помилок і покращувати читабельність коду.

Резюме

Область видимості в JavaScript поділяється на:

  • Глобальна область видимості: доступна в усьому коді.
  • Область видимості функції: доступна лише всередині функції.
  • Блокова область видимості: доступна всередині конкретного блоку, визначеного фігурними дужками.

Коротка відповідь

Для співбесіди
Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.

Дочитали статтю?
Практика завдань