Що таке контекст виконання (Execution Context)?

Це питання можна почути майже на кожному Frontend чи Backend інтервʼю рівня junior/middle.

Якщо дуже коротко, контекст виконання (Execution Context) - це середовище, де прямо зараз виконується наш код, простіше кажучи, значення this в момент виконання. Ми можемо мати 3 типи контексту виконання:

1. Глобальний контекст (Global Execution Context)

Цей контекст створюється один раз, коли завантажується файл і до нього належить весь код, який не всередині функцій: глобальні змінні, глобальні функції, this на верхньому рівні.

У браузері глобальний об’єкт зазвичай window.

var x = 10;

function sayHi() {

console.log("hi");

}

console.log(x); // 10

console.log(this === window); // true (але залежить від режиму)

2. Контекст виконання функції (Function Execution Context)

Тут важливо запамʼятати: кожен виклик функції - це новий контекст. Навіть якщо функція одна й та сама, контекст щоразу буде інший. У ньому JS зберігає: параметри функції, локальні змінні (ті, що всередині {}), this для конкретного виклику.

function sum(a, b) {

const result = a + b;

return result;

}

sum(1, 2); // один контекст

sum(5, 10); // інший контекст

3. Контекст модуля (Module Execution Context)

Якщо код запускається як ES module, то він виконується в контексті модуля. Він схожий на глобальний, але є 2 важливі відмінності:

Змінні не стають глобальними автоматично
this на верхньому рівні буде undefined

const x = 123;

console.log(this); // undefined

// x не з'явиться як window.x

</script>

1. Глобальний контекст (Global Execution Context)

2. Контекст виконання функції (Function Execution Context)

3. Контекст модуля (Module Execution Context)

Коментарі (0)