Execution Context

Source: Dev.to

Bayangkan Execution Context seperti sebuah dapur.
Sebelum kamu memulai memasak (mengeksekusi kode), kamu perlu ruang kerja, peralatan (variabel), dan resep (functions). Jadi, di sini Execution Context adalah tahap persiapan atau “set‑up” tersebut.

Global Execution Context (GEC)

• Ini adalah kotak default.
• Jika kode kamu tidak berada di dalam fungsi, maka ia berada di sini.
• GEC secara otomatis membuat dua hal: objek window (di browser) dan kata kunci spesial this.

Functional Execution Context (FEC)

• Setiap kali kamu memanggil fungsi, JavaScript membuat kotak mini baru khusus untuk fungsi tersebut.
• Di dalam kotak ini disimpan variabel dan logika spesifik tugas fungsi itu.

The Two Phases (The “Magic” Trick)

JavaScript tidak sekadar membaca kode baris demi baris dari atas ke bawah dan langsung mengeksekusinya. Ia melakukan dua lintasan di dalam “kotak” kamu secara instan.

Fase A: Penciptaan (Alokasi Memori)

• Membuat objek global (window).
• Menyiapkan ruang memori untuk variabel dan fungsi.
• Hoisting: deklarasi variabel diatur menjadi undefined, dan seluruh deklarasi fungsi disimpan ke dalam memori.

Fase B: Eksekusi

• Karena JavaScript bersifat single‑threaded (hanya dapat melakukan satu hal dalam satu waktu), ia menggunakan Call Stack untuk melacak “kotak” mana yang sedang dikerjakan.
• Bayangkan setumpuk keripik Pringles:
  • Global Context adalah keripik paling bawah.
  • Saat kamu memanggil functionA(), keripik baru (Context A) diletakkan di atasnya.
  • Jika functionA memanggil functionB, Context B diletakkan di atas Context A.
  • Setelah functionB selesai, ia “dibuang” (popped) dari tumpukan, dan kontrol kembali ke Context A.