Какая область видимости у переменных внутри callback-функции — там, где она вызывается, или там, где описана?

Лексическая область видимости и замыкания

В JavaScript область видимости переменных определяется местом, где функция объявлена, а не местом её вызова. Это называется лексической (статической) областью видимости. Когда вы создаёте callback-функцию, она захватывает переменные из своего внешнего окружения на момент объявления, формируя замыкание.

Пример для понимания

function outer() {
  let message = 'Привет из outer';
  
  function callback() {
    console.log(message); // message доступна, так как callback объявлена внутри outer
  }
  
  return callback;
}

const fn = outer();
fn(); // Выведет: 'Привет из outer'

Здесь callback объявлена внутри outer, поэтому она имеет доступ к переменной message. Даже когда мы вызываем fn() в глобальной области, она всё равно использует message из outer.

Контраст с динамической областью видимости

Если бы JavaScript использовал динамическую область видимости, то переменные определялись бы местом вызова. В примере выше при вызове fn() в глобальной области message была бы не определена. Но благодаря лексической области видимости callback сохраняет доступ к своему исходному окружению.

Практическое применение

Это свойство широко используется в асинхронном программировании, обработчиках событий и функциях высшего порядка. Например, при передаче callback в setTimeout или addEventListener, функция запоминает переменные из места своего создания, что позволяет избежать ошибок с устаревшими данными.

Вывод

Понимание лексической области видимости и замыканий необходимо для написания предсказуемого и безопасного кода на JavaScript. Это помогает избежать распространённых ошибок, связанных с потерей контекста, и эффективно использовать функциональные возможности языка.