Что такое контекст выполнения в JavaScript? Контекст выполнения (EC) — это среда, в которой выполняется часть кода.
Чтобы понять, как все работает в JavaScript, необходимо сначала понять контекст выполнения, потому что все, что происходит в JavaScript, происходит в контексте выполнения.
Основной обзор
Execution Context (EC) — это среда, в которой выполняется часть кода, содержащая всю необходимую информацию для выполнения этой части кода.
Внутри контекста выполнения есть три вещи:
- Объявления переменной Environment, const и var, функции и объект аргументов
- Цепочка областей
- это ключевое слово
После завершения компиляции кода механизм JavaScript создает глобальный контекст выполнения (GEC) для кода верхнего уровня (кода, который не находится ни в одной функции). Выполнение кода верхнего уровня начинается в GEC, всякий раз, когда строка кода вызывает функцию, создается код выполнения для этой функции. Существует только один глобальный контекст выполнения, но каждый вызов функции имеет свой собственный контекст выполнения.
Фазы в контексте выполнения
В контексте выполнения в основном есть 2 фазы:
- Этап создания
- Этап выполнения
Мы также можем интерпретировать это таким образом, что контекст выполнения состоит из двух частей: памяти (переменная среда) и кода (поток выполнения).
На первом этапе, то есть на этапе создания, все переменные сохраняются в среде переменных или в памяти. Переменным, отличным от функции, присваивается неопределенное значение, тогда как переменные функции содержат буквенный код соответствующих функций.
И на следующем этапе начинается выполнение кода. Поскольку Javascript является синхронным однопоточным языком, выполнение кода происходит по одному оператору за раз и в определенном порядке.
Я буду использовать приведенный ниже фрагмент кода для дальнейшего объяснения фаз в контексте выполнения.
После компиляции приведенного выше кода будет создан глобальный контекст выполнения, как обсуждалось выше, контекст выполнения состоит из двух фаз создания и потока выполнения.
Этап создания
На этапе создания все переменные в коде верхнего уровня будут храниться в среде переменных. Переменные, отличные от функции, т.е. name
, marksInMaths
, marksInScience
, marksInEnglish
, marksInArts
, averageMarks
получают неопределенное , назначенное им, тогда как переменные для функции, т.е. calculateAverageMarks
, calculateTotalMarks
, содержат соответствующие функции.
Фаза выполнения
На следующем этапе код начинает выполняться сверху вниз по одному оператору за раз, только функции не выполняются, поскольку функции выполняются только после того, как какой-либо оператор вызывает их. Таким образом, если мы снова увидим код, строка номер 18 будет выполнена непосредственно после строки номер 5.
Во время выполнения значение переменных изменяется в среде переменных в соответствии с оператором в коде. Таким образом, для строки номер 1, т.е. const name = "Joy"
, значение имени изменяется на "Joy"
из неопределенного, аналогичным образом изменяются все значения.
Поток выполнения — создание нового контекста выполнения для вызываемой функции.
Когда выполняется строка номер 18, то есть const averageMarks = calculateAverageMarks(marksInMaths, marksInScience,... );
, создается новый контекст выполнения для вызываемой функции calculateAverageMarks()
. Поскольку JavaScript имеет один поток выполнения, одновременно может выполняться только один контекст выполнения (EC), поэтому выполнение предыдущего EC, т. е. GEC, останавливается и начинается выполнение нового EC.
Новый контекст выполнения также имеет те же две фазы, что и в GEC. Во время фазы выполнения этой функции, когда выполняется строка const totalMarks = calculateTotalMarks(maths, science, english, arts);
, создается новый контекст выполнения. Как только обе фазы фазы calculatTotalMarks() заканчиваются, возвращаемое значение этой функции отправляется в контекст выполнения, откуда она была вызвана, т. е. calculateAverageMarks(), и значение сохраняется в переменной среды ( значение totalMarks изменяется на возвращаемое значение с начального значения undefined) этого контекста выполнения, и выполнение этого EC продолжается с возвращенным значением.
Точно так же, как только выполнение всех строк функции calculateAverageMarks() завершено, возвращаемое значение заменяет значение переменной AverageMarks в среде переменных глобального контекста выполнения, и выполнение GEC продолжается со значением, с которого оно было остановлено до этого. .
Стек вызовов
Для приведенного выше фрагмента кода с двумя вызываемыми функциями было создано два контекста выполнения (по одному для каждого) вместе с глобальным контекстом выполнения. Это означает, что для реального приложения существуют сотни контекстов выполнения (EC), созданных для каждого приложения. Но как управлять последовательностью контекстов выполнения? Это управляется стеком вызовов в движке JavaScript.
Стек вызовов отслеживает контексты выполнения. Как только функция вызывается, для нее создается новый EC и помещается на вершину стека вызовов, EC наверху контролирует выполнение, и его выполнение происходит первым.
И как только выполнение этого EC заканчивается, EC удаляется из стека и управление возвращается к предыдущему EC.
Стек вызовов играет важную роль в движке JavaScript, управляя всем потоком выполнения.
Краткое содержание
Контекст выполнения (EC) — это среда, в которой выполняется часть кода. Для приложения создается один глобальный контекст выполнения, а также несколько контекстов выполнения (по одному для каждого вызова функции). В контексте выполнения в основном есть две фазы: фаза создания и фаза выполнения. Для каждого вызова функции создается новый EC, и управление переходит к новому EC, после завершения выполнения этого EC управление переходит к предыдущему EC. Эта последовательность смены управления и выполнения управляется стеком вызовов.
Ресурсы
https://www.udemy.com/course/the-complete-javascript-course
Дополнительные материалы на PlainEnglish.io. Подпишитесь на нашу бесплатную еженедельную рассылку новостей. Подпишитесь на нас в Twitter, LinkedIn, YouTube и Discord . Заинтересованы в хакинге роста? Ознакомьтесь с разделом Схема.