JS оператор var

Загальний опис

var — це ключове слово в JavaScript, яке використовується для оголошення змінних. На відміну від сучасних let і const, змінні, оголошені за допомогою var, мають деякі особливості, які важливо враховувати.

По-перше, змінні, оголошені через var, мають функціональну область видимості, тобто вони доступні всередині всієї функції, навіть якщо оголошені всередині блоку. Наприклад:

function example() {
    if (true) {
        var message = "Привіт!";
    }
    console.log(message); // "Привіт!" - змінна доступна поза блоком.
}

По-друге, якщо змінна оголошується через var поза функцією, вона автоматично стає властивістю глобального об'єкта (window у браузері):

var globalVar = 10;
console.log(window.globalVar); // 10

Ще одна особливість — підняття (hoisting). Змінні, оголошені через var, «піднімаються» на початок своєї області видимості, хоча їх значення залишається невизначеним до моменту присвоєння:

console.log(a); // undefined
var a = 5;

Через це код може працювати неочікувано, якщо розробник не враховує підняття.

Використання var в сучасному JavaScript поступово відходить на другий план через появу більш зрозумілих і безпечних конструкцій let і const. Проте знання про var залишаються важливими для розуміння спадкових кодових баз.

правити

Порада

Не покладайтеся на undefined для перевірки існування змінної, оголошеної через var. Змінна може бути піднята, навіть якщо ще не ініціалізована.

автор: Bond правити

Порада

Коли оголошуєте змінну глобально через var, пам’ятайте, що вона додається до об'єкта window. Це може створити конфлікти з іншими глобальними змінними.

автор: Bond правити

Порада

При використанні старого коду, де активно застосовується var, перевіряйте наявність дублювання змінних. var дозволяє повторно оголошувати змінні в одній області видимості, що може викликати помилки.

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

var ім’я_змінної = значення;

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі Серверні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	1	1	1	3	12	3

Підтримка: мобільні переглядачі

Переглядач
	4.4	18	4	1

Підтримка: серверні переглядачі

Переглядач
	0.10.0	1.0

Приклади

+ запропонувати свій приклад у пісочниці

function testVarScope() {
    var x = 10;

    if (true) {
        var x = 20; // Перезаписує x у функціональній області
        console.log(x); // 20
    }

    console.log(x); // 20 - значення змінилося через функціональну область
}

testVarScope();

function hoistingExample() {
    console.log(a); // undefined
    var a = 5;
    console.log(a); // 5
}

hoistingExample();