Все, что вам нужно знать о подъеме в Javascript

Введение

Привет всем, это мой третий блог. Мне очень нравится делиться своим обучением.

через эти блоги. Это мой первый блог, в котором я освещаю чисто техническую тему!

Javascript работает совсем иначе, чем многие другие языки программирования.

В некоторых аспектах он работает совершенно иначе, чем любые другие языки! В JS есть много типичных концепций, и «Подъем» — лишь одна из них. Здесь, в этом блоге, я говорил о

как подробно работает JS и что такое подъем!

Контекст выполнения

Прежде чем мы перейдем к «подъему», давайте сначала разберемся, что такое JS Execution Context. Я уверен, что многие люди не знают, что это такое. На самом деле, я не знал, что такая вещь существует, до нескольких дней назад!!

Контекст выполнения — это сердце любой JS-программы! Еще до того, как наша программа начнет свое выполнение, контекст выполнения создается в два этапа:

Этап создания памяти

Этап выполнения кода

Давайте посмотрим с наглядной помощью, что это означает.

На этапе создания памяти память выделяется для переменных и функций.

В случае переменных выделяется undefined, а в случае функций — само определение функции целиком. См. приведенный ниже фрагмент кода.

Что происходит еще до того, как вышеуказанная программа начнет выполняться?

состояние контекста выполнения перед выполнением программы.

Как уже говорилось, переменным 'a' и 'b' присваивается значение 'undefined' (которое можно рассматривать как заполнитель), а две функции fun1() и fun2() назначаются

только их собственное определение функции. Все это происходит на этапе создания памяти.

На следующем шаге, т.е. на этапе выполнения кода, когда вызывается fun1() и fun2(), совершенно новый контекст выполнения создается в области кода глобального контекста выполнения. Эти два дочерних контекста выполнения также имеют память и код фазы, как показано ниже.

Как и в глобальном контексте выполнения, здесь также выделяется память для локальных переменных, параметров, принадлежащих каждой функции. Если присутствует какая-либо вложенная функция, то все определение функции назначается этой конкретной функции.

Посмотрим, что будет дальше. Уже становится интересно!

Функции вызывались с аргументами (a и b). Поэтому сначала вместо 'x' сохранялось 'undefined'. и 'y', но на следующем шаге фактическое значение выделяется, как показано ниже.

После выполнения каждой функции отдельные дочерние контексты выполнения

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

Наконец, в самом конце, после завершения выполнения программы, глобальное выполнение

сам контекст уничтожается и выталкивается из стека вызовов.

Фу! Стек вызовов!? Это что!??

Ну, стек вызовов — это место, где JS хранит различные задачи, которые необходимо выполнить.

в конкретной программе один за другим.Стек вызовов поддерживает порядок выполнения контекстов выполнения. Для нашего примера программы стек вызовов будет примерно таким:

Сначала в стек помещается глобальный контекст выполнения, поскольку он

начальная точка программы. Затем контексты выполнения fun1() и fun2()

толкаются соответственно.

Это было все о контексте выполнения. Сначала я знаю, что это довольно много.

но важно знать, прежде чем прыгать в «подъем».

Подъем

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

подъем в JS. Существует распространенное заблуждение, что подъем означает

переменные перемещаются в верхнюю часть программы или что-то в этом роде.Это неправда! JS ничего не перемещает вверх/вниз!! Это все волшебство контекста исполнения!!

Обратитесь к приведенному выше фрагменту кода. Как вы думаете, что будет на выходе?

.

.

.

Сюрприз! Сюрприз! Результат:

внутри весело1!!

неопределенный

Теперь, почему это вам может быть интересно, ну, если вы помните наши старые добрые

другом контексте выполнения, даже до того, как программа начнет выполнение, функции fun1() присваивается определение ее функции, а переменной 'x' присваивается значение 'undefined'.

когда fun1() вызывается перед инициализацией, он работает отлично… но

печать 'x' дает 'undefined'.

Давайте посмотрим на другой сценарий… можете ли вы догадаться, что произойдет в этом случае?

Ну, он печатает 'undefined' для 'x', но затем, когда вызывается fun1(), он выдает 'TypeError'.

Это связано с тем, что fun1 здесь действует только как переменная и, таким образом, инициализирует 'undefined' точно так же, как 'x'.

Это оно! Да, это только подъем. Все, что вам нужно понять, это

контекст выполнения и все!!

Что ж, теперь вы можете сказать, что подъем не работает для всех объектов JS. Например,

'let' и 'const' не поднимаются. Ну, это отчасти верно, и этому есть причина.

Давайте посмотрим на разные типы переменных JS!

Let vs Var vs Const

Как многие из нас знают, существует три типа переменных JS (let, var и const). , let и const были введены несколько лет назад, чтобы избежать этой проблемы с подъемом.

var: это просто. Когда переменная объявляется с ключевым словом 'var', она присоединяется к глобальной области ('окну' объект). Они могут быть повторно инициализированы

любой нет. раз и подняты.

let: переменные, объявленные с помощью 'let', являются немного более строгими.Переобъявление этих переменных строго НЕТ НЕТ! и приведет к SyntaxError.Кроме того, эти переменные не присоединен к глобальной области, но в отдельной области (также называется «областью блока»).

const: это очень похоже на let только. Только это, в отличие от переменных let.

которые могут быть инициализированы позже,переменные «const» должны быть инициализированы только во время объявления и не могут быть повторно инициализированы. Это также не присутствует в глобальной области видимости, но в другой области, например «let '.

Подъем в «let» и «const»

Поскольку «let» и «const» вместе присутствуют в разных областях видимости,

не работает так же, как с переменными ‘var’.

Почему это происходит? Здесь также и 'a', и 'b' назначаются 'undefined' в контексте выполнения. Но так как оба обращаются до инициализации, они приводят к ReferenceError.

Но с «var» это давало «undefined», верно? Не какой-либо «ReferenceError»!

Да, и это потому, что время между объявлением «let» и «const»

переменные до того момента, как они будут инициализированы, находятся в так называемой 'временной мертвой зоне' и, следовательно, недоступны. В результате, когда мы пытаемся получить доступ к этим

во временной мертвой зоне это приводит к знаменитой ошибке ReferenceError.

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

Вывод

Ух ты!! Это было тяжело!!😅 ха-ха!! Я надеюсь, что это было в какой-то степени полезно. Когда я впервые изучил «подъем», я выучил его очень неправильно. Не хочу, чтобы кто-то столкнулся с тем же! Просто помните, что ничто не поднимается наверх или куда-либо еще!! Это просто контекст выполнения.

Надеюсь, вам понравилось. В моем следующем блоге я постараюсь осветить еще одну важную

концепция в JS. До свидания и спасибо, что нашли время, чтобы прочитать😊