Анализ поведения JavaScript при подъеме.

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

Независимо от того, где мы объявляем наши переменные и функции, JavaScript перемещает их в верхнюю часть области видимости на этапе компиляции. Здесь следует отметить, что JavaScript поднимает только объявления, а не инициализации. Также поднимаются переменные, объявленные с помощью ключевых слов var, а не те, которые объявлены с помощью ключевых слов let и const

Ниже мы увидим различные примеры, которые помогут нам лучше понять поведение JavaScript при подъеме переменных и функций.

Понимание на примерах:

Ниже мы рассмотрим различные сценарии и поймем, когда подъемник работает, а когда нет.

Регулируемый подъем 📌

Рассмотрим фрагмент кода ниже и посмотрим, каким будет результат?

name = ‘tony’
console.log(name);
var name;

Вывод: Тони

Несмотря на то, что мы инициализировали переменную name до того, как мы ее объявили, наша программа отображает вывод как tony, поскольку JavaScript перемещает объявление в верхнюю часть области видимости, так что это как на самом деле ведет себя программа.

var name;
name = ‘tony’
console.log(name);

Примечание📝: Хотя кажется, что объявление поднялось в программе при подъеме, на самом деле здесь происходит то, что объявления функций и переменных добавляются в память на этапе компиляции. .

Давайте посмотрим, что произойдет, если мы объявим и инициализируем переменную после console.

console.log(name);
var name = ‘tony’

Вывод: не определен

Здесь мы получаем результат как undefined, потому что поднимаются только объявления, а не инициализация, поэтому наша программа фактически ведет себя, как показано ниже.

var name;
console.log(name);
name = ‘tony’

объявление переменной перемещено наверх, но инициализация все еще остается после оператора консоли, таким образом, переменная name объявляется, но не была инициализирована, и мы получаем результат как undefined.

Когда переменная объявлена ​​внутри функции, она будет поднята вверху функции, см. Пример ниже.

var text = ‘Hello’;
function sayHello() {
name = ‘tony’;
console.log( text + ‘ ‘ + name);
var name;
}
sayHello();
console.log(name);

Вывод: Привет, Тони

ReferenceError: имя не определено

Мы получаем справочную ошибку, когда пытаемся получить доступ к переменной name в операторе консоли за пределами функции, потому что теперь переменная name поднимается вверху функции приветствия, а не в верхней части программы, и становится локальной переменной вместо глобальная переменная, как показано ниже

Функция Hoisiting 📌:

Так же, как объявления переменных поднимаются и перемещаются наверх, объявленные функции также поднимаются, см. Пример ниже:

sayHello();
function sayHello() {
console.log( ‘Hi there, nice to meet you !!’);
}

Вывод: Привет, приятно познакомиться !!

Мы вызвали функцию sayHello () перед ее объявлением и получили желаемый результат из-за подъема, программа выполняется следующим образом:

объявление функции перемещено вверх из-за подъема!

Однако если мы используем функции как выражение, оно не поднимается, потому что, будь то подъем переменной или функции, он работает только с ключевым словом var, см. Ниже.

sayHello();
let sayHello = function() {
console.log( ‘Hi there, nice to meet you !!’);
}

Вывод: ReferenceError: невозможно получить доступ к "sayHello" до инициализации.

Резюме📝:

Подъем - это стандартное поведение JavaScript, которое позволяет нам получать доступ к переменным и функциям до их объявления. Подъем работает с ключевым словом var, а не с ключевыми словами let и const, поднимаются только объявления, а не инициализация. Если переменная объявлена ​​внутри функции, она будет поднята вверху функции, а не на уровне глобальной области видимости. Функции тоже поднимаются, но функции как выражения - нет.

Надеюсь, эта статья помогла вам разобраться в подъеме JavaScript. Если вам понравилась эта статья, похлопайте в ладоши 👏 и поделитесь своими знаниями.