Что такое подъем в JavaScript?

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

Проще говоря:

• Переменные, объявленные с помощью var, инициализируются как неопределенные во время подъема.

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

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

Важно отметить, что поднимаются только объявления, а не присваивания. Задания остаются там же, где вы их написали.

Примечание: те, кто говорит, что при подъеме код перемещается наверх, на самом деле ошибаются. Код никогда не перемещается вверх.

Пример:

console.log(myVariable); // undefined      
var myVariable = 10;

Этот код выполняет два действия одновременно. Сначала он объявляет переменную myVariable и помещает ее в область видимости, но ее значение все еще не определено. Поэтому команда console.log отображает неинициализированное значение как неопределенное. После этого переменной myVariable присваивается значение 10.

Однако, если вы попытаетесь изменить его, это не окажет никакого влияния на предыдущее объявление. Например:

console.log(myVariable); // ReferenceError: myVariable is not defined      
myVariable = 10;

Здесь мы не объявили переменную myVariable, поэтому перед попыткой ее изменения выдается ошибка ReferenceError.

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

var и let также поднимаются:

И var, и let поддерживаются в JavaScript, но их поведение немного отличается.

вар:

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

Пример:

console.log(myVariable); // undefined
var myVariable = 10;

В приведенном выше коде объявление var myVariable выводится за пределы области видимости, но присвоение myVariable = 10 остается на месте. Таким образом, оператор console.log выводит неопределенное значение, поскольку переменная существует, но ей еще не присвоено значение.

позволять:

С другой стороны, когда вы объявляете переменную с помощью let, поведение подъема немного отличается. Объявление переменной поднимается, но вы не можете получить доступ к переменной до ее объявления. Это известно как «временная мертвая зона». Если вы попытаетесь получить доступ к переменной let до ее объявления, вы получите ошибку ReferenceError.

Пример:

console.log(myVariable); // ReferenceError: myVariable is not defined
let myVariable = 10;

В этом случае объявление let поднимается, но доступ к переменной до ее объявления невозможен. Таким образом, оператор console.log выдает ошибку ReferenceError, поскольку переменная еще не определена.

Вот в принципе в случае let, даже если оно поднято, значение переменной остаётся неопределённым. Потому что для этой переменной нет места в памяти. Из-за этого нельзя ссылаться на этот адрес. Поскольку в памяти нет адреса myVariable = 10, выдается ошибка ссылки.

константа:

Ключевое слово const позволяет создавать константы, которые представляют собой переменные, которые нельзя переназначить после присвоения им значения.

Пример: 1

const PI = 3.142;
PI = 22/7; // Attempt to reassign the value of PI
console.log(PI); // Output: TypeError: Assignment to constant variable

В этом примере мы определяем PI it как константу с начальным значением 3,142. Когда мы пытаемся переназначить новое значение PI, выдается ошибка TypeError, поскольку константы не могут быть переназначены.

Пример: 2

const PI;
console.log(PI); // Output: SyntaxError: Missing initializer in const declaration
PI = 3.142;

В этом случае мы объявляем константу PI без ее инициализации. Этот код выдает SyntaxError, поскольку константы должны быть объявлены и инициализированы одновременно.

Пример:3

function getCircumference(radius) {
  console.log(circumference);
  circumference = PI * radius * 2;
  const PI = 22/7;
}
getCircumference(2); // ReferenceError: circumference is not defined

Здесь, в функции getCircumference, мы пытаемся получить доступ к окружности до ее объявления. Он выдает ошибку ReferenceError, поскольку переменная еще не определена.

При использовании const необходимо объявить и инициализировать переменную перед ее использованием.

В целом, var и let включены в JavaScript, но их поведение и концепция временной мертвой зоны применимы только к переменным let. const создает константы, которые нельзя переназначить после инициализации.

Все необъявленные переменные являются глобальными переменными:

function hoisted() {
a = 20;
var b = 100;
}
hoisted();
console.log(a); // 20
// can be accessed as a global variable outside the hoisted() function.

console.log(b);
// As it is declared, it is bound within the bounds of the hoisted() function. We cannot print it outside the hoisted() function.
output: ReferenceError: b is not defined

Переменные области действия функции

Мы видим, что объявление переменной var message в области действия функции hoist() находится в начале функции.
Чтобы избежать этой проблемы, мы обязательно объявим переменную перед ее использованием.

В обоих приведенных вами примерах вывод будет неопределенным.

Пример: 1

function hoist() {
  console.log(message);
  var message = 'Hoisting is all the rage!';
}
hoist(); // Output: undefined

Пример: 2

function hoist() {
  var message;
  console.log(message);
  message = 'Hoisting is all the rage!';
}

hoist(); // Output: undefined

В обоих случаях выходные данные не определены, поскольку переменные поднимаются наверх соответствующих областей, но их назначение происходит позже в исходном порядке кода.

Функциональные выражения

Функциональные выражения не поднимаются и выдают ошибку TypeError, поскольку выражение рассматривается как переменная, а не как функция.

expression(); // Output: "TypeError: expression is not a function
var expression = function() {
  console.log('Will this work?');
};

Строгий режим

Судя по названию, это ограниченный вариант JavaScript, который не допускает использования переменных до их объявления. Запускаем наш код в строгом режиме:

• Устраняет некоторые молчаливые ошибки JavaScript, заменяя их явными ошибками генерации.

• Исправляет ошибки, затрудняющие оптимизацию движкам JavaScript.

• Возможно, вы пропустили объявление переменной, используйте strict, который остановил вас, выдав ошибку ссылки.
  

'use strict';

console.log(hoist); // Output: ReferenceError: hoist is not defined
hoist = 'Hoisted';

Заключение

Важно понимать подъем в JavaScript при объявлении переменных и функций. По мере объяснения подъема вы поймете, как на самом деле обрабатывается код JavaScript.