В этой статье я собираюсь обсудить подъем javascript и развенчать некоторые мифы относительно этого.
Каждый разработчик Javascript сталкивается с термином Подъем при изучении языка. Но большинство из них ошибаются.
Это два самых популярных мифа о подъемниках
- Во время компиляции все объявления переменных и функций перемещаются в начало программы.
const
иlet
не поднимает
Итак, давайте поговорим о первом мифе,
Все ли объявления переменных и функций перемещаются в начало программы?
“NO”
Какие! Что произойдет, если это не так?
Согласно MDN, объявления переменных и функций помещаются в память на этапе компиляции, но остаются там, где вы ввели их в свой код. »
Итак, давайте посмотрим, как JavaScript запускает программы?
На более высоком уровне выполнение любой JS-программы состоит из двух этапов.
- Составление программы
- Выполнение программы
Поэтому, когда мы передаем любую программу JS Engine, этот движок сначала компилирует ее в машинный код, а затем выполняет. И при компиляции программы JS Engine помещает все объявления в память.
- Когда компилятор встречает любой оператор вроде
var someVariable = "SomeValue"
, он помещает переменнуюsomeVariable
в память и инициализируется с помощьюundefined
. - Когда компилятор видит какое-либо объявление функции, он помещает объявление функции в память и инициализирует его определением функции.
Таким образом, мы можем заметить разницу в том, что переменная с ключевым словом var
помещается в память и инициализируется с помощью undefined
, а переменная с ключевым словом function
помещается в память и инициализируется определением реальной функции.
console.log(a); var a = "Hello js"; foo(); function foo() { console.log("From Inside foo"); }
Когда приведенный выше фрагмент кода будет запущен, мы получим следующий результат
undefined From Inside foo
- Теперь давайте проанализируем, что только что произошло. Когда мы запускаем приведенный выше фрагмент кода, Javascript сначала компилирует программу, поэтому во время компиляции он видит, что в строке номер 2 есть оператор, начинающийся с
var a
, поэтому компилятор помещаетa
в память и инициализирует его с помощьюuneifined
. Затем он снова видит объявление функцииfunction foo() {
в строке номер 4, поэтому компилятор помещает объявлениеfoo
в память и инициализирует его своим определением. - Теперь, на этапе выполнения, JS Engine обнаруживает первую строку, затем он проверяет память на наличие переменной
a
и обнаруживает, что существует переменная с именемa
и имеет значениеundefined
, поэтому он печатает undefined. Затем в строке номер 2 он присваиваетa
Hello js
. Теперь в строке номер 3 он вызываетfoo
, затем снова JS Engine просматривает память в поискахfoo
и обнаруживает, что у него есть функцияfoo
и ее определение, поэтому он вызывает функцию.
Это было о том, как поднимаются var
и functions
.
Теперь перейдем ко второму мифу,
const
и let
не поднимает, это правда?
«Снова большое нет»
const
и let
также, подъемные как var
и function
. Но в отличие от var
и _31 _, _ 32_ и let
не инициализируются. И мы не можем использовать его перед строкой, в которой он объявлен, потому что он попадает в специальную зону, называемую «временная мертвая зона (TMZ)».
Давайте разберемся на примере:
console.log(a); var a= "hello world" var b = "again hello" console.log(b)
Итак, к настоящему времени вы уже догадались, что выводит вышеуказанная программа, да, вы правы, это
undefined again hello
Хорошо, теперь вы можете угадать результат работы приведенной ниже программы
console.log(a); var a= "hello world" var b = "outer b" console.log(b) { console.log(b); // ReferenceError: Cannot access 'b' before initialization let b = "inner b"; }
Вы, наверное, догадались, что он напечатает, как и вышеуказанная программа.
udefined outer b
Но это не так. Поскольку область видимости let
находится на уровне блока, она поднимается и попадает в временную мертвую зону. Вот почему мы получаем ReferenceError
. Итак, оказалось, что let
поднимается, как var
и function
. То же самое и с const
.
Заключение
Что ж, теперь мы знаем, что подъем не означает физического перемещения всего объявления в начало программы. И самое главное const
и let
действительно поднимаются.
Надеюсь, статья вам понравилась. Любые предложения и отзывы приветствуются.