💻 <easy.advice/>

Какие способы создания переменных в JavaScript ты знаешь и в чем между ними разница?

👨‍💻 Frontend Developer 🔥 Очень высокий 🎚️ Легкий
#JavaScript #База JS

Краткий ответ

В JavaScript есть три способа объявления переменных:

  • var
  • let
  • const

Основные различия между ними касаются области видимости, возможности переопределения и всплытия (hoisting).

Подробное сравнение

Характеристикаvarletconst
Область видимостиФункциональнаяБлочнаяБлочная
ПереопределениеДаДаНет
Повторное объявлениеДаНетНет
Всплытие (hoisting)Да (без инициализации)Да (но в TDZ)Да (но в TDZ)
ИнициализацияМожно позжеМожно позжеОбязательно сразу

Что такое TDZ?

Temporal Dead Zone — это период между созданием переменной и её инициализацией, когда доступ к переменной вызывает ошибку.

console.log(a); // ReferenceError
let a = 10;

Примеры

var — устаревший способ, но всё ещё работает

function testVar() {
  if (true) {
    var message = "Привет из if";
  }
  console.log(message); // работает! → "Привет из if"
}

let — предпочтительный способ для изменяемых переменных

function testLet() {
  if (true) {
    let message = "Привет из if";
    console.log(message); // "Привет из if"
  }
  // console.log(message); // ReferenceError
}

const — когда переменная не должна изменяться

const PI = 3.14;
PI = 3.1415; // TypeError: Assignment to constant variable.

Важно: const запрещает менять саму ссылку, но не объект, на который она указывает:

const user = { name: "Alex" };
user.name = "Ivan"; // Это работает!

Когда использовать что?

  • Используй const по умолчанию.
  • Используй let, если значение будет изменяться.
  • Избегай var, если только не работаешь с очень старым кодом.

Задача 1: Что выведет консоль?

function test() {
  console.log(a);
  var a = 5;
}
test();
Ответ `undefined` — переменная всплывает, но инициализация происходит позже.

Задача 2: Что произойдёт?

{
  console.log(b);
  let b = 10;
}
Ответ ReferenceError — доступ до инициализации (`TDZ`)

Дополнительные задачи

Задача 3: Что выведет консоль?

let x = 10;
{
  let x = 20;
  console.log(x);
}
console.log(x);
Ответ 20 и 10 — переменные `x` из разных областей видимости (блочная область).

Задача 4: Что произойдёт?

console.log(typeof undeclaredVar);
console.log(undeclaredVar);
var undeclaredVar = 42;
Ответ `undefined` и undefined — переменная всплывает, но инициализируется позже.

Задача 5: Что произойдёт при запуске?

if (true) {
  const a = 5;
}
console.log(a);
Ответ ReferenceError — `a` объявлена внутри блока, снаружи недоступна.

Задача 6: Можно ли переопределить переменную?

let name = "Aleksandr";
let name = "Evgeniya";
Ответ Нельзя — будет SyntaxError: Identifier 'name' has already been declared.

Резюме

Вопрос про var, let, const — это классика собеседований.
Важно не просто запомнить, а понимать разницу: в области видимости, переопределении и всплытии.
В реальной разработке выбирайте const и let, избегайте var.

Хочешь больше статей по подготовке к собеседованию? Подпишись на EasyAdvice(@AleksandrEmolov_EasyAdvice), добавляй сайт в избранное и прокачивай себя каждый день 💪