JavaScript Хостинг
Хостинг (подъём) - это стандартное поведение JavaScript, заключающееся в перемещении объявлений наверх.
Поднятие JavaScript объявления
В JavaScript переменную можно объявить после того, как она была использована.
Другими словами: переменную можно использовать до того, как она была объявлена.
Пример 1 даёт тот же результат, что и Пример 2:
Пример 1
x = 5; // Присвоить 5 к x
elem = document.getElementById("demo"); // Найти элемент
elem.innerHTML = x; // Отобразить x в элементе
var x; // Объявить x
Попробуйте сами »
Пример 2
var x; // Объявить x
x = 5; // Присвоить 5 к x
elem = document.getElementById("demo"); // Найти элемент
elem.innerHTML = x; // Отобразить x в элементе
Попробуйте сами »
Чтобы понять это, вы должны понимать термин "хостинг" (подъём).
Подъем - это стандартное поведение JavaScript, заключающееся в перемещении всех объявлений в верхнюю часть текущей области видимости (в верхнюю часть текущего скрипта или текущей функции).
Ключевые слова let и const
Переменные, определенные с помощью let и const поднимаются в верхнюю часть блока, но не инициализируются.
Значение: блоку кода известно о переменной, но её нельзя использовать, пока она не будет объявлена.
Использование переменной let перед её объявлением приведет к ReferenceError (ошибке).
Переменная находится во "временной мертвой зоне" от начала блока до его объявления:
Использование переменной const перед её объявлением является синтаксической ошибкой, поэтому код просто не запускается.
Узнайте больше о let и const в JS Let / Const.
Инициализации JavaScript не запускаются
JavaScript поднимает только объявления, но не инициализации.
Пример 1 не даёт такой же результат, как Пример 2:
Пример 1
var x = 5; // Инициализировать x
var y = 7; // Инициализировать y
elem = document.getElementById("demo"); // Найти элемент
elem.innerHTML = x + " " + y; // Отобразить x и y
Попробуйте сами »
Пример 2
var x = 5; // Инициализировать x
elem = document.getElementById("demo"); // Найти элемент
elem.innerHTML = x + " " + y; // Отобразить x и y
var y = 7; // Инициализировать y
Попробуйте сами »
Имеет ли смысл, что y не определен в последнем примере?
Это связано с тем, что наверх поднимается только объявление (var y), а не инициализация (= 7).
Из-за подъема y был объявлен до его использования, но поскольку инициализации не поднимаются, значение y не определено.
Пример 2 то же самое, что писать:
Пример
var x = 5; // Инициализировать x
var y; // Объявить y
elem = document.getElementById("demo"); // Найти элемент
elem.innerHTML = x + " " + y; // Отобразить x и y
y = 7; // Присвоить 7 к y
Попробуйте сами »
Объявите свои переменные наверху!
Подъем (хостинг) является для многих разработчиков неизвестным или недооцененным поведением JavaScript.
Если разработчик не понимает подъема, программы могут содержать баги (ошибки).
Чтобы избежать ошибок, всегда объявляйте все переменные в начале каждой области.
Так как JavaScript интерпретирует код именно так, это всегда хорошее правило.
JavaScript в строгом режиме не позволяет использовать переменные, если они не объявлены.
Изучите "use strict" в следующей главе учебника на нашем сайте W3Schools на русском.
