Давайте начнем с одного примера, а затем разберем, как этот код работает за кулисами.

var x = 10;
var y = 20;

function add(a,b){
  return a+b;
}

var result = add(x,y);

console.log(result) //30

давайте разберемся с этим кодом

Сначала объявите переменные x и y и инициализируйте их соответствующими значениями 10 и 20.

Во-вторых, объявите функцию добавления, которая принимает аргумент и возвращает сумму аргументов, т. е. 10 + 20 = 30.

В-третьих, вызовите функцию добавления с аргументами в качестве значений переменной x и y и сохраните результат в переменной result.

Наконец, вывод переменной результата с помощью console.

При выполнении приведенного выше кода JavaScript делает много вещей.

Когда движок JavaScript выполняет код JavaScript в это время, он создает контексты выполнения.

Каждый контекст выполнения имеет две фазы

  1. Фаза создания.
  2. Фаза выполнения.

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

Когда движок JavaScript выполняет код в первый раз, он создает глобальный контекст выполнения. На этом этапе JavaScript выполняет некоторые задачи.

  1. Создайте глобальный объект, т.е. окно в веб-браузере или глобальное в Node.js.
  2. Создайте этот объект (это ключевое слово) и привяжите его к глобальному объекту. В случае веб-браузера это ключевое слово присоединяется к оконному объекту, а в Node js это ключевое слово присоединяется к глобальному объекту.
  3. Настройте кучу памяти для хранения ссылок на переменные и функции.
  4. Сохраните объявления функций в куче памяти и переменных в глобальном контексте выполнения с начальными значениями как неопределенными.

Когда движок JavaScript выполняет приведенный выше код, он выполняет следующие действия на этапе создания.

  1. Сохраните переменную x, y и результат, а также объявление функции add() в глобальном контексте выполнения.
  2. Инициализируйте переменные неопределенным значением, т. е. x = undefined , y = undefined и result = undefined.

После этапа создания глобальный контекст выполнения переходит к этапу выполнения.

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

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

Для каждого вызова функции механизм JavaScript создает новый функциональный вызов выполнения.

Контекст выполнения функции аналогичен глобальному контексту выполнения. Но вместо создания глобального объекта движок JavaScript создает объект arguments, который является ссылкой на все параметры функции.

В нашем примере механизм JavaScript создает объект аргументов, который ссылается на все параметры, переданные в функцию, и устанавливает это значение в глобальный объект, в случае веб-браузера это значение присоединяется к объекту окна, а в Node js это значение прикрепляется к глобальному объект, а также инициализирует параметр a & b неопределенным значением.

На этапе выполнения контекста выполнения функции механизм JavaScript присваивает значение 10 и 20 параметру a и b и возвращает результат (30) в глобальный контекст выполнения.

Чтобы отслеживать все контексты выполнения, включая глобальный контекст выполнения и контексты выполнения функций, механизм JavaScript использует стек вызовов.

Давай останемся на связи

Я надеюсь, что эта статья будет полезна для вас, увидимся на следующей!