Hack Frontend Community

Лексическое окружение (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 находит и управляет переменными во время выполнения.