Hoisting переменных в JavaScript

Когда вы объявляете переменную с помощью var, её объявление поднимается (hoisted) к началу функции или глобального контекста, в котором она объявлена. Однако это не означает, что переменная будет доступна повсеместно в функции или за её пределами.

Поднятие переменных: Объявление переменной var поднимается к началу функции или глобального контекста, но инициализация остаётся на месте. Это означает, что переменная будет существовать в её области видимости, но её значение будет undefined до тех пор, пока не произойдёт инициализация.

Примеры

1. Поднятие внутри функции:

function example() {
  console.log(x); // undefined, так как x объявлена, но не инициализирована
  var x = 5;
  console.log(x); // 5
}

example();

В этом примере переменная x объявляется с помощью var, и её объявление поднимается к началу функции example. Поэтому первое console.log(x) не выдаёт ошибку, но выводит undefined, так как инициализация переменной происходит позже в коде.

2. Область видимости функции:

function example() {
  if (true) {
    var x = 5;
  }
  console.log(x); // 5, так как var имеет область видимости функции, а не блока
}

example();

Здесь переменная x объявлена внутри блока if, но из-за области видимости var она всё ещё доступна в остальной части функции example. Это происходит потому, что var имеет область видимости функции, а не блока.

3. Глобальная область видимости:

var globalVar = 'I am global';

function example() {
  console.log(globalVar); // 'I am global'
}

example();
console.log(globalVar); // 'I am global'

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

Различие с `let` и `const`

Переменные, объявленные с помощью let и const, имеют блочную область видимости и не поднимаются так же, как переменные var. Это значит, что они видимы только внутри блока (например, внутри { ... }), в котором они объявлены.

Пример с let и const:

function example() {
  if (true) {
    let y = 10;
    const z = 20;
    console.log(y); // 10
    console.log(z); // 20
  }
  console.log(y); // ReferenceError: y is not defined
  console.log(z); // ReferenceError: z is not defined
}

example();

В этом примере переменные y и z объявлены с помощью let и const, соответственно, и имеют область видимости блока, поэтому они не доступны вне блока if.

Примеры

Различие с let и const

Различие с `let` и `const`