Відмінності між var, let та const
У JavaScript є три ключові слова для оголошення змінних: var, let та const. Вони відрізняються областю видимості, можливістю переназначення значень та механізмом підняття.
var
- Область видимості: Область видимості функції. Змінні, оголошені за допомогою
var, доступні протягом усієї функції, навіть якщо оголошені всередині блоку. - Підняття: Змінні
varпіднімаються — їх оголошення переміщується на початок функції, але ініціалізація залишається на місці. - Переназначення: Можна переназначити та повторно оголосити ту ж змінну в одній і тій же області видимості.
Приклад з var:
javascript
function example() {
console.log(a); // undefined, змінна піднята, але значення ще не призначене
var a = 10;
if (true) {
var a = 20; // переназначення змінної в тій же функції
console.log(a); // 20
}
console.log(a); // 20
}
example();let
- Область видимості: Блокова область видимості. Змінні, оголошені за допомогою
let, доступні лише всередині блоку, де вони оголошені (наприклад, всередині фігурних дужок{}). - Підняття:
letтакож піднімається, але залишається в "Тимчасовій мертвій зоні" до ініціалізації. - Переназначення: Не можна повторно оголосити змінну з тим же ім'ям в одній і тій же області видимості.
Приклад з let:
javascript
function example() {
// console.log(b); // Помилка: не можна отримати доступ до ініціалізації (ReferenceError)
let b = 10;
if (true) {
let b = 20; // нова змінна, локальна для блоку if
console.log(b); // 20
}
console.log(b); // 10
}
example();const
- Область видимості: Блокова область видимості, як і у let.
- Підняття: const також підлягає підняттю та тимчасовій мертвій зоні до ініціалізації.
- Переназначення: Змінні, оголошені за допомогою const, не можуть бути переназначені або повторно оголошені. Проте об'єкт, оголошений з const, може бути змінений, якщо його структура дозволяє зміни.
Приклад з const:
javascript
function example() {
const c = 10;
// c = 20; // Помилка: Призначення константній змінній.
if (true) {
const c = 30; // нова змінна в локальній області видимості
console.log(c); // 30
}
console.log(c); // 10
const obj = { name: "Alice" };
obj.name = "Bob"; // Дозволено: зміна пропси об'єкта
console.log(obj.name); // "Bob"
// obj = {}; // Помилка: не можна переназначити змінну
}
example();Основні відмінності
| Характеристика | var | let | const |
|---|---|---|---|
| Область видимості | Функція | Блок | Блок |
| Підняття | Піднято з undefined | Тимчасова мертва зона до ініціалізації | Тимчасова мертва зона до ініціалізації |
| Повторне оголошення | Дозволено | Заборонено в одній і тій же області видимості | Заборонено в одній і тій же області видимості |
| Зміна значення | Дозволено | Дозволено | Переназначення заборонено (але мутація об'єкта можлива) |
Коротка відповідь
Для співбесідиPremium
Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.