«Чтобы добраться туда, нужно знать, куда вы собирались». - Сюзанна Вейн
Что такое среда выполнения?
Чтобы запустить компьютерную программу, написанную на языке программирования, должно быть задействовано множество процессов и шагов, программа должна взаимодействовать с оборудованием, ОС, а также выполнять сложные задачи, такие как управление кучей и стеками, управление памятью, сборка мусора и т. Д. и многое другое.
Этот процесс не обрабатывается программистом, и это очень динамичный процесс, который отличается от программы к программе. Среда выполнения предоставляет возможность управлять вышеуказанным процессом и запускать программы на разных платформах.
Среда выполнения JavaScript
JavaScript - это язык высокого уровня, потому что перед выполнением программа, написанная на JavaScript, должна быть интерпретирована или скомпилирована (на основе движка) в машинный код. и выполнение программы, обрабатываемой специальной программой, известной как «JavaScript Runtime Engine».
Каждый браузер поставляется с определенным движком времени выполнения JS и не требует отдельной установки.
V8 Engine - используется в веб-браузере Google Chrome и NodeJS. Разработан с использованием C ++.
SpiderMonkey - используется в Firefox и разработан с использованием C ++.
Nitro - используется в веб-браузере Safari.
Чакра - используется в веб-браузере Microsoft Edge.
Эти реализации каждого движка JavaScript полностью отличаются друг от друга, но для того, чтобы поддерживать стандарт, все эти движки основаны на спецификации ECMAScript и обеспечивают выполнение одной и той же программы JS на каждом движке без изменений.
Как работает программа на JavaScript
Прежде чем выяснять, что находится внутри движка JavaScript, давайте выясним, как выполняется программа JavaScript.
Сначала, когда программа JS запускается, она запускается в контексте выполнения. Есть два контекста исполнения
- Глобальный контекст выполнения
- Функциональный контекст выполнения
Каждый из этих контекстов выполнения содержит две основные фазы выполнения программы, а именно.
1. Фаза творения
- Создание объекта активации путем сканирования кода JS и перечисления переменных и объявлений.
- Создание цепочки областей видимости - это список всех переменных в текущей функции.
- Создание глобальной переменной «this». («окно» для клиентского JS)
2. Этап исполнения
- Выполнение кода начинается на этом этапе. Значения будут присвоены переменным, перечисленным ниже на этапе создания. Если это функция, она будет выполняться в отдельном функциональном контексте выполнения.
Давайте теперь посмотрим, как это работает внутри.
В приведенной выше программе мы сначала определяем две переменные и функцию, которая объединяет две строки и другую переменную, которая содержит результаты возвращенного значения функции.
Давайте теперь посмотрим, как работает эта программа, на простой диаграмме.
Как вы можете видеть на этапе создания, значения будут неопределенными, но когда дело доходит до фазы выполнения, значения для каждой переменной будут присвоены, и для каждой функции создается отдельный «Функциональный контекст выполнения». И после выполнения функции значение будет возвращено, и «функциональный контекст выполнения» будет уничтожен.
Теперь предположим, что есть функции рекурсии или есть функции, которые могут вызывать другие функции внутри него. В это время движок JS должен отслеживать порядок выполнения функции, это будет обрабатываться «стеком вызовов».
Вот простой пример того, как это работает
Для вышеуказанной функции стек вызовов будет таким.
Однако важно знать, что при вызове функций внутри другой функции и рекурсивных функций важно следовать передовым методам кодирования, в противном случае функции продолжают создавать функциональный контекст выполнения внутри своего родительского функционального контекста выполнения, и это приведет к ошибке переполнения стека. .
Подъем
В предыдущем приложении мы видели, что на этапе создания переменные в глобальном контексте выполнения будут определены как «неопределенные».
Процесс происходит следующим образом: когда приложение загружается в движок JS, оно сначала перечисляет все переменные в глобальном контексте выполнения. и переместите все наверх, но при этом не присваивает реальных значений, эта концепция называется Подъем.
Но в разных случаях это ведет себя по-разному.
Переменный подъем
Есть определенные способы определения переменных: var, let, и const. когда дело доходит до подъема. Теперь давайте посмотрим на примере простой программы.
Если мы проверим эти переменные по отдельности (в консоли разработчика или на NodeJS), результат будет следующим.
Строка 1 - undefined
Строка 2- ReferenceError: Нет доступа к 'b' до инициализации
Строка 3- ReferenceError: Нет доступа 'c 'перед инициализацией
Как мы видим, программа определила наличие переменных с именами «b» и «c», что означает, что подъем работает для всех трех способов объявления типов переменных. Но когда дело доходит до const и let, возникает исключение.
Причина в том, что переменные движка JS, определенные как const и let, хранятся в Script Scope, а между тем переменные, определенные как var хранится в Global Scope.
и движок JS не предоставляют доступ к области скрипта. для доступа к переменным, определенным с помощью let, и const сначала нужно инициализировать значение.
Подъем функции
Подъем также работает с функциями. Существует два способа определения функций для обоих способов, при которых подъем действует по-разному. Давайте посмотрим на пример того, как подъем ведет себя с функциями.
В приведенной выше программе мы определили функции, одна из которых - функция (add), функция стрелки (multiply), а другая - ссылка на функцию ( разделить). Результат будет таким, как показано ниже.
answerOfAdd: 30
answerOfMultiply: выдает ошибку «ReferenceError: multiply не определено»
answerOfDivide: выдает ошибку «TypeError: div не является функцией»
По результатам мы можем видеть, что когда дело доходит до функции, она поддерживает только функции не для стрелочных функций и ссылок на функции, но подъем работает для обоих из них.
Эта статья была вдохновлена следующими видео, в которых объясняется и наглядно показано, как работает движок времени выполнения JS и хостинг с практическим подходом.
Контекст выполнения JavaScript.
