Как быстро начать работу с VUE3.0: Начните обучение
Рекомендации по теме: Учебники по JavaScript
Мы, вероятно, часто слышим «среда выполнения», «область действия», «прототип (цепочка)», «контекст выполнения» и т. д. Что они описывают?
Мы знаем, что js — слабо типизированный язык, и тип переменной определяется только во время выполнения. Когда движок js выполняет код js, он также выполняет лексический анализ , синтаксический анализ , семантический анализ и другую обработку сверху вниз, а после завершения анализа кода генерирует AST (абстрактное синтаксическое дерево) и, наконец, генерирует машинный код. что ЦП может выполняться на основе AST и выполняться.
Кроме того, движок JS также будет выполнять другую обработку при выполнении кода. Например, в V8 есть два этапа:
Это приводит к две концепции: «Контекст выполнения» и «цепочка областей действия».
Из вышесказанного мы можем знать: когда js-код выполняет часть исполняемого кода, будет создан соответствующий контекст выполнения.
Прежде всего, есть понятие, соответствующее исполняемому коду в js: «среда выполнения» — глобальное окружение, окружение функций и eval .
Во-вторых, для каждого контекста выполнения есть три важных атрибута:
Давайте посмотрим на два фрагмента кода:
varscope="globalscope" function checkscope(){;
varscope="локальная область видимости";
функция е(){
область возврата;
}
return f();}checkscope(); varscope="глобальная область видимости";функция checkscope(){;
varscope="локальная область видимости";
функция е(){
объем возврата;
}
return f;}checkscope()(); Что они напечатают?
Почему? Ответ в том, что их стеки контекста выполнения различны!
Что такое «стек контекста выполнения»?
При выполнении исполняемого кода подготовка производится заранее. «Подготовка» здесь профессионально называется «контекстом выполнения». Но с увеличением количества исполняемого кода, такого как функции, как управлять таким количеством контекстов выполнения? Итак, движок JS создал концепцию стека контекста выполнения.
Мы можем полностью использовать массив для имитации его поведения (в нижней части стека всегда есть глобальный контекст выполнения globalContext).
Мы определяем EStack, сначала
EStack=[globalContext]
и затем моделируем первый фрагмент кода:
EStack. push(<checkscope> functionContext); EStack.push(<f> functionContext);EStack.pop();EStack.pop();
И второй фрагмент кода выглядит следующим образом:
EStack.push(<checkscope> functionContext); EStack.pop();EStack.push (<f> functionContext);EStack.pop();
Причина в том, что вам может потребоваться сначала изучить концепцию «замыкания»!
Кстати, как добиться "долговременной экономии данных" при "фронтенд-модуляризации"?
кэш? Нет. Закрытие!
Прежде всего, область действия относится к области программы, где определяются переменные. Область определяет, как найти переменную, что определяет права доступа текущего исполняемого кода к переменной.
Существует два типа области видимости: статическая область видимости и динамическая область видимости .
Статическая область видимости, используемая JS, также называется «лексической областью видимости». Область действия функции определяется при ее определении.
Судя по вышесказанному, переменные в лексической области будут иметь определенную область действия в процессе компиляции. Эта область действия является «текущим контекстом выполнения». После ES5 мы используем «лексическую среду» вместо области видимости для описания контекста выполнения. Лексическое окружение состоит из двух членов:
Давайте еще посмотрим на пример:
var value=1 ;функция foo(){
console.log(value);}function bar(){
значение вар = 2;
foo();}bar(); Возвращаясь к приведенному выше определению, что следует вывести?
Разберем процесс выполнения:
Выполните функцию foo(), сначала выполните поиск внутри функции foo, чтобы узнать, есть ли значение локальной переменной. Если нет, найдите код на верхнем уровне в зависимости от позиции, когда он был определен, то есть значение = 1. Таким образом, результат будет напечатан как 1.
Конечно, это не так просто и можно обобщить. Можно проанализировать это с точки зрения контекста выполнения.
Выше мы говорили о двух компонентах лексической среды (области действия). В сочетании с контекстом выполнения нетрудно обнаружить, что посредством ссылки на внешнюю лексическую среду область действия может расширяться по стеку слой за слоем, создавая цепную структуру, простирающуюся наружу от текущей среды.
Давайте посмотрим на другой пример:
функция foo(){
console.dir(бар);
вар а=1;
функциональная панель(){
а=2;
}}console.dir(foo);foo(); Из статической области действия глобальная функция foo создает атрибут [[scope]] своего собственного объекта
foo
[[scope]]=[globalContext];
( ), он также последовательно введет период определения и период выполнения функции foo. В период определения функции foo [[scope]] функциональной панели будет включать глобальную встроенную область и встроенную область действия foo
bar[[scope]]=[fooContext,globalContext]
Это доказывает
;этот момент: «JS пройдет. Ссылки на внешнюю лексическую среду используются для создания цепочки областей видимости переменных объектов, обеспечивая тем самым упорядоченный доступ к переменным и функциям, к которым имеет доступ среда выполнения».
Вернемся к вопросу в контексте выполнения, мы говорили ранее. В чем разница между ними? Давайте поговорим о том, почему они печатают «локальную область действия» одинаково: это все то же самое предложение: «JS использует лексическую область видимости, а область действия функции зависит от места, где она создается». » — Выполнение функции JS Используется цепочка областей видимости, которая создается при определении функции. В этой цепочке областей определена вложенная функция f(), и область действия переменной в ней должна ссылаться на локальные переменные. Независимо от того, когда и где выполняется f(), эта привязка по-прежнему действительна, когда выполняется f().
Если переменную невозможно найти в ее собственной записи лексической среды, ее можно искать на внешнем уровне на основе ссылки на внешнюю лексическую среду до тех пор, пока ссылка на внешнюю лексическую среду в самой внешней лексической среде не станет null .
Аналогично этому «поиск на основе цепочки прототипов в объектах»:
__proto__ имеет значение null). Разница также очевидна: цепочка прототипов — это ссылка, которая устанавливает наследование объекта через атрибут прототипа, тогда как цепочка области действия относится к замыканию, которое позволяет внутренним функциям получать доступ к внешним функциям. Прямо или косвенно, все цепочки областей действия функций в конечном итоге связаны с глобальным контекстом.
Рекомендации по теме: Учебное пособие по изучению JavaScript.
Выше приведено глубокое понимание того, как движок JavaScript выполняет код JS. Для получения дополнительной информации обратите внимание на другие соответствующие статьи на китайском веб-сайте PHP!
