Создание глобального контекста выполнения для кода верхнего уровня, т.е. кода, который не находится внутри какой-либо fn. Следовательно, код вне fn выполняется первым.
Код внутри тела fn fn-decln/exprsn выполняется только при его вызове.

Контекст выполнения (EC)

Среда, в которой выполняется часть JS.
Хранит всю необходимую информацию для выполнения некоторого кода, например локальные переменные, аргументы, передаваемые в fn.
Код JS всегда выполняется внутри EC.
Ровно один глобальный EC независимо от размера JS-проекта.
Контекст по умолчанию, созданный для кода, не входящего в какую-либо fn.
Затем код выполняется внутри глобального EC
После выполнения кода верхнего уровня выполняется fns и ожидание C/bs
Для каждого вызова fn создается новый EC для выполнения этой fn. То же самое касается и методов, поскольку они также являются объектами, прикрепленными к объектам.
Все эти EC вместе составляют стек вызовов.
Когда все fns выполняются, движок ожидает прибытия CB и выполняет их. Бывший. обратный вызов события click, предоставляемый циклом событий.

Что внутри ЕС

1. Переменная среда, состоящая из
2. объявления let, const, var
3. Функции

4. объект аргументов: сохраняет все аргументы, переданные fn, в своем EC.
   Каждая fn получает свой собственный EC, как она называется. И объявленные переменные попадают в среду переменных

5. Цепочка областей действия:
   Fns может получать доступ к переменным за пределами fns, используя цепочку областей действия.
   Содержит ссылки на переменные, расположенные за пределами текущей fn, и для отслеживания цепочки областей действия они сохраняются в каждом EC.

6. Каждый EC также получает ключевое слово «this».

Все эти три вышеперечисленных кода генерируются на «фазе создания», прямо перед выполнением. Это то, что необходимо для запуска кода на верхнем уровне.

Для стрелок fns EC:

У нас не будет: объекта аргументов, этого ключевого слова. Стрелка fns использует ближайшую к ней обычную fn, две вышеупомянутые.

аргументы: объект, подобный массиву, содержащий все аргументы, передаваемые в обычную fn, а не в стрелочную fn.

Куча памяти стека вызовов = JS Engine

Стек вызовов

Место, где EC складываются друг на друга, чтобы отслеживать, на каком этапе выполнения мы находимся. Самый верхний EC — это тот, который мы используем. По завершении выполнения он удаляется из вершины стека, и управление передается базовому EC.
Если существует вложенный вызов fn, внешний вызов fn будет приостановлен, чтобы вернуть результат выполнения внутреннего fn в стеке вызовов, поскольку JS имеет только один поток выполнения. Теперь предыдущий EC станет активным EC
Затем самый верхний EC извлекается из стека вызовов по мере его возврата.
Самым низким в стеке вызовов будет глобальный EC, сверху будут вызовы fn по мере их появления.
Гарантирует, что порядок выполнения никогда не потеряется.
В конце концов, программа будет завершена, и глобальный EC также будет вынесен из стека вызовов.

Код JS выполняется внутри EC, которые размещаются в стеке вызовов.

Hence, we can say that each EC has:
1. Variable environment
2. Scope chain
3. 'this' keyword

Обзор

Как переменные нашей программы организованы и доступны JS Engine.
Где живут переменные
Где мы можем получить доступ к определенным переменным, а где нет.

Лексическая область видимости:

JS имеет лейкальную область видимости, что означает, что область видимости контролируется размещением fns и блоков в коде.
Бывший. Вложенная fn имеет доступ к переменным своей родительской fn.

Объем:

Пространство или среда, в которой объявлена ​​определенная переменная (переменная среда в случае fns). Это переменная env, которая хранится в fns EC.
Для fns Var env и область действия одинаковы.

Three scopes in JS are:
1. Global scope
2. Fn scope
3. Block scope [ES6]

Область — это место объявления переменных. Следовательно, это верно и для Fns, поскольку fns — это просто значения, хранящиеся в переменных.

Область действия переменной

Область нашего кода, где можно получить доступ к определенной переменной.

Область действия отличается от области действия переменной с небольшими различиями.

## Global Scope:
For top level code
For variables declared outside of any fn or block which are accessible from everywhere
Variables in this scope are at the top of scope chain. Hence, can be used by every nested scope.

## Fn Scope:
Each fn has creates its own scope
Variables are accessible ONLY inside fn, NOT outside. Else Reference Error
Also called local scope
Fn decln, exprsn, arrow all three create their own scopes.
Only way to create scope using ES5 which had only fn & global scope.

## Block Scope:
Introduced in ES6, not only fn but {} also create a scope known as block scope which work only for ES6 variables i.e let-const types. DOesn't work for variables declared with 'var' as its fn scoped.
Variables accessible only inside block i.e {} 
This only applies to variables declared with let-const only.
Fns are also block scoped in ES6 (only in strict mode, should be used)
variables declared using 'var' will be accessible outside the block
Scoped to the current fn or the global scope.
var variables only care about fn, they ignore blocks. They end up in nearest fn scope.

Каждая вложенная область имеет доступ к переменным из своей внешней и глобальной области. То же самое применимо и к аргументам fn.

Если fn не находит переменную в своей области видимости, она просматривает цепочку областей видимости, чтобы найти переменные во внешних областях видимости. Этот процесс называется поиском переменной в цепочке областей видимости. Это не работает наоборот, т.е. мы не можем получить доступ к вложенным переменным или областям fn снаружи fn или внешних областей.
Родственные области не могут получить доступ к переменным друг друга
Только самая внутренняя область может получить доступ к своим внешним областям, а не наоборот.

Один EC для каждого fn в том же порядке, в котором вызывается fn, помещается в стек вызовов с его переменными внутри EC. Global EC находится внизу стека вызовов

Цепочка областей действия:
Все дело в порядке, в котором fns прописаны в коде.
Не имеет ничего общего с порядком вызова fns.
Цепочка областей видимости получает переменную среду из EC.
Порядок вызовов fn вообще не имеет отношения к цепочке областей.

const a = 'Alice';
first();

function first(){
  const b = "Hello";
  second();

  function second(){
    const c = "Hi";
    third();
  }
}

function third(){
  const d = "Hey";
  console.log(d   c   b   a); // Reference Error
}

## Call Stack order:
third() EC - top
second() EC
first() EC
global EC - bottom


Scope Chain:
second() --nested inside--> first() --nested inside--> global scope.
third() is independently defined inside gloabal scope.

Reference Error occurred because both 'c' as well as 'b' cannot be accessed using the scope chain.

Краткое содержание:
EC, Var Env, Cl-Sk, Scope, Scope-chain — это разные, но связанные понятия.
Определение области действия задает вопросы, где находятся переменные, где мы можем получить к ним доступ, а где нет.
Лексическая область видимости в JS: правила доступа к переменным основаны на том, где именно в коде написаны fns и блоки.
Каждая область имеет доступ ко всем переменным из всех своих внешних областей. Это цепочка областей действия, которая является улицей с односторонним движением. Внешняя область никогда не может получить доступ к переменным внутренней области.
Цепочка областей определенной области равна суммированию всех переменных Env всех родительских областей.
Цепочка областей действия не имеет ничего общего с порядком вызова fns. Это вообще не влияет на цепочку областей действия.
Когда переменная не найдена в текущей области видимости, движок просматривает цепочку областей видимости, пока не найдет искомую переменную. Это называется поиском переменных.