Лексическое окружение (Lexical Environment) в JavaScript

Что такое Лексическое окружение?

Лексическое окружение (Lexical Environment) — это внутренняя структура, которая используется движком JavaScript для хранения переменных, объявленных в определённой области видимости, а также для определения того, где и как эти переменные можно использовать.

Каждая функция, блок {}, и глобальная область создают своё лексическое окружение при выполнении.

Состав Lexical Environment

Лексическое окружение состоит из двух частей:

1. Environment Record
   • Хранит все локальные переменные, функции, параметры.
2. Ссылка на внешнее лексическое окружение (outer)
   • Указывает на внешнее окружение, в котором функция была создана (не вызвана!).

Пример

function outer() {
  let a = 1;

  function inner() {
    let b = 2;
    console.log(a + b);
  }

  inner();
}

outer();

• Когда вызывается outer, создается Lexical Environment для outer с переменной a.
• При вызове inner создается Lexical Environment для inner с переменной b, и она имеет доступ к a через замыкание (closure).

Визуализация цепочки окружений

Лексическое ≠ динамическое

JavaScript использует лексическую область видимости, а это значит:

Переменные доступны в зависимости от места определения в коде, а не от места вызова.

let x = 10;

function log() {
  console.log(x);
}

function run() {
  let x = 20;
  log(); // ❗ Выведет 10, а не 20!
}

run();

log() запоминает контекст своего определения, а не вызова

Вывод

• Лексическое окружение — это механизм хранения переменных в определённой области видимости.
• Каждая функция, блок или глобальная область имеют своё окружение.
• Оно формирует цепочку областей видимости, благодаря чему работает scope и замыкания.
• Понимание Lexical Environment помогает понять, как JavaScript находит и управляет переменными во время выполнения.