Переменная глобально ограничена, но почему функция недоступна?

Question

Почему не удалось выполнить первый консольный журнал, несмотря на существование глобальной переменной?

const message = 'starts with mssg #1'; //Global scope

function scopeTest() {
  console.log('1. test #1: ', message); // <-- why unable to read Global scope here?

  const message = 'changed to mssg #2';
  console.log('2. test #2: ', message);

  if (true) { //Code block is OK
    const message = 'changed to mssg #3';
    console.log('3. test #3: ', message);
  }

  { //Another code block is OK
    const message = 'changed to mssg #4';
    console.log('4. test #4: ', message);
  }

  console.log('5. test last: ', message);
}
scopeTest();

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

Пожалуйста, пролите свет. Спасибо

Answer 1

Поскольку любые ссылки на message внутри scopeTest будут ссылаться на ближайшую область действия , в которой объявлена ​​переменная message , то есть внутри функции scopeTest.В то время, когда вы пытаетесь сослаться на него, message идентифицируется как имя переменной в области действия внутри функции (то есть, когда вы ссылаетесь на нее, вы ссылаетесь на локальную переменную, а не на глобальнуюпеременная), но локальная переменная еще не была инициализирована - интерпретатор не пересек линию const message =, поэтому переменная message находится в демилитаризованной зоне или временной мертвой зоне - пытаясь сослаться на нее перед нейинициализация приведет к ошибке, которая не определена.

Если вы удалите const message изнутри scopeTest (так что ссылки на имя переменной message будут ссылаться на глобальную переменную),или переместите const message на выше test #1 (так, чтобы оно инициализировалось к тому времени, когда вы пытаетесь его зарегистрировать), оно будет работать как положено:

const message = 'starts with mssg #1'; //Global scope

function scopeTest() {
  const message = 'changed to mssg #2';
  console.log('1. test #1: ', message);
}
scopeTest();

и

const message = 'starts with mssg #1'; //Global scope

function scopeTest() {
  console.log('1. test #1: ', message);
}
scopeTest();

Answer 2

Переменные в JavaScript hoisted при объявлении. Это означает, что даже если вы объявите их позже в коде, они все равно будут доступны при более ранних вызовах: это похоже на объявление (а не на присваивание значения!), Которое было бы записано в первой строке блока, где вы объявил это.

В своем коде вы объявили переменную message в теле функции, поэтому она пытается получить доступ к этой из-за поднятия вместо той, которая объявлена ​​в глобальной области видимости.

Больше читать по этому вопросу здесь