Konteks Perlaksanaan JavaScript

Sebelum memahami apa itu Konteks Pelaksanaan JavaScript, kita perlu tahu bagaimana dan dalam persekitaran mana kita boleh menjalankan kod JavaScript.

Pertama sekali, kami boleh menjalankan JavaScript dalam dua persekitaran:

Melalui Penyemak Imbas
Melalui Node.js

Bagaimanakah kod JavaScript dijalankan pada komputer kami?

Apabila kami menulis kod JavaScript pada komputer kami dan kemudian cuba menjalankannya, kod tersebut mula-mula pergi ke sama ada Penyemak Imbas atau Node.js.

Walau bagaimanapun, kod JavaScript yang kami tulis tidak difahami secara langsung oleh Penyemak Imbas atau Node.js. Pada ketika ini, kedua-duanya menghantar kod ke Enjin JavaScript yang terbina di dalamnya. Terdapat pelbagai jenis enjin, contohnya:

Enjin V8 dalam Google Chrome,
SpiderMonkey dalam Mozilla Firefox,
Enjin V8 dalam Node.js, dsb.

Seterusnya, Enjin JavaScript menyusun kod JavaScript ke dalam kod mesin. Kod mesin ini kemudiannya dihantar ke komputer, yang melaksanakannya, dan kami melihat output dipaparkan.

Sebagai pengaturcara, kita perlu mempunyai pemahaman yang baik tentang langkah perantaraan ini, iaitu, cara Enjin JavaScript menyusun kod JavaScript ke dalam kod mesin.

Jadi, sekarang kita perlu memahami cara Enjin JavaScript berfungsi. Enjin JavaScript berfungsi dalam dua cara untuk menukar kod kepada kod mesin. Yang pertama ialah Tafsiran dan yang kedua ialah Kompilasi. Jadi, apakah itu Tafsiran dan Kompilasi?

Apakah Tafsiran, dan Bagaimana Ia Berfungsi?

Tafsiran ialah proses membaca semua kod sumber yang ditulis dalam bahasa peringkat tinggi baris demi baris dan menukar setiap baris kepada kod mesin serta-merta selepas membacanya. Jika terdapat ralat semasa membaca baris kod, prosesnya berhenti di situ, memudahkan pengaturcara mengenal pasti ralat tersebut. Ini menjadikan penyahpepijatan menjadi mudah. Walau bagaimanapun, memandangkan proses ini membaca kod baris demi baris, ia adalah lebih perlahan.

Apakah Kompilasi, dan Bagaimana Ia Berfungsi?

Kompilasi ialah proses menukar semua kod sumber yang ditulis dalam bahasa peringkat tinggi kepada kod mesin sekaligus. Dalam kes ini, walaupun terdapat ralat dalam kod, ia masih akan menyusun dan hanya menunjukkan ralat semasa runtime. Akibatnya, ia menjadi lebih sukar bagi pengaturcara untuk mengenal pasti ralat, menjadikan penyahpepijatan lebih mencabar. Walau bagaimanapun, memandangkan keseluruhan kod sumber ditukar kepada kod mesin sekaligus, proses ini secara perbandingan lebih pantas. Jadi sekarang, persoalan timbul: Adakah JavaScript adalah bahasa yang disusun atau ditafsirkan?

Adakah JavaScript Bahasa yang Disusun atau Ditafsirkan?

Pada mulanya, JavaScript dianggap sebagai bahasa yang ditafsirkan. Walau bagaimanapun, memandangkan proses ini agak perlahan, enjin JavaScript moden mula menggunakan teknik baharu yang menggabungkan kedua-dua tafsiran dan kompilasi, yang dikenali sebagai Kompilasi Just-In-Time (JIT). Proses ini menggabungkan tafsiran dan penyusunan untuk menukar kod kepada kod mesin. Akibatnya, ia adalah lebih cepat dan lebih mudah untuk nyahpepijat berbanding kaedah lama.

Untuk memahami cara Kompilasi Just-In-Time (JIT) JavaScript berfungsi, kita perlu memahami Konteks Pelaksanaan JavaScript. Sekarang mari cuba memahami Konteks Pelaksanaan JavaScript.

Mula-mula, lihat contoh kod berikut.

Contoh Kod

var a = 1;

function one() {
  console.log(a);

  function two() {
    console.log(b);

    var b = 2;

    function three(c) {
      console.log(a + b + c);
    }

    three(4);
  }

  two();
}

one();

Salin selepas log masuk

Keluaran

1
undefined
7

Salin selepas log masuk

Apabila kami menjalankan kod, kami cuba mencetak pembolehubah b sebelum ia diisytiharkan dalam fungsi two(), dan output tidak ditentukan. Namun, tiada ralat berlaku. Persoalannya timbul: bagaimana pembolehubah b mempunyai nilai yang tidak ditentukan? Jawapannya terletak pada Konteks Pelaksanaan JavaScript. Kini, kami akan meneroka Konteks Pelaksanaan JavaScript dengan lebih terperinci.

Terdapat dua jenis Konteks Pelaksanaan dalam JavaScript:

Konteks Pelaksanaan Global
Konteks Pelaksanaan Fungsi

Setiap Konteks Pelaksanaan melalui dua fasa: Fasa Penciptaan dan Fasa Pelaksanaan.

Konteks Pelaksanaan Global

Apabila kami menjalankan kod JavaScript, perkara pertama yang berlaku ialah Konteks Pelaksanaan Global. Konteks ini mula-mula melalui Fasa Penciptaannya, di mana beberapa perkara berlaku:

Fasa Penciptaan

Objek Global dicipta.
Objek ini dicipta dan diberikan nilai Objek Global.
Objek Pembolehubah dicipta, di mana semua fungsi dan pembolehubah diisytiharkan. Pembolehubah diperuntukkan tidak ditentukan sebagai nilainya dan fungsi diperuntukkan rujukan kepada fungsi masing-masing.

Setelah Fasa Penciptaan selesai, Konteks Pelaksanaan Global beralih ke fasa seterusnya: Fasa Pelaksanaan, di mana lebih banyak langkah berlaku.

Fasa Perlaksanaan

Pembolehubah yang diisytiharkan dalam Fasa Penciptaan dan dimulakan dengan undefined kini diberikan nilai masing-masing.
Fungsi yang diisytiharkan dalam Fasa Penciptaan, yang disimpan sebagai rujukan, kini dipanggil dan dilaksanakan.

Konteks Perlaksanaan Fungsi

Apabila fungsi yang dirujuk semasa Fasa Pelaksanaan Konteks Pelaksanaan Global dipanggil, setiap fungsi mencipta Konteks Pelaksanaan Fungsinya sendiri. Sama seperti Konteks Pelaksanaan Global, Konteks Pelaksanaan Fungsi juga melalui Fasa Penciptaan, di mana beberapa langkah berlaku:

Fasa Penciptaan

Objek parameter dicipta untuk fungsi tersebut.
Objek ini dicipta dan diberikan nilai Objek Global.
Objek Pembolehubah dicipta, di mana semua fungsi dan pembolehubah diisytiharkan. Pembolehubah diperuntukkan tidak ditentukan sebagai nilainya dan fungsi diperuntukkan rujukan kepada fungsi masing-masing.

Setelah Fasa Penciptaan selesai, Konteks Pelaksanaan Fungsi beralih ke Fasa Pelaksanaan, di mana lebih banyak langkah berlaku.

Fasa Perlaksanaan

Pembolehubah yang diisytiharkan dalam Fasa Penciptaan, yang dimulakan dengan undefined, kini diberikan nilai masing-masing.
Fungsi yang diisytiharkan dalam Fasa Penciptaan kini dipanggil dan dilaksanakan.

Konteks Pelaksanaan Fungsi dalam Fungsi Bersarang

Apabila fungsi dipanggil dalam fungsi lain, Konteks Pelaksanaan Fungsi baharu dicipta untuk setiap fungsi ini. Setiap Konteks Pelaksanaan Fungsi kemudiannya melalui kedua-dua Fasa Penciptaan dan Fasa Pelaksanaan. Proses ini berterusan untuk setiap fungsi yang dipanggil dalam fungsi lain dan setiap fungsi akan melalui fasa ini secara berasingan.

Jom lihat rajah di bawah.

JavaScript Execution Context – How JS Code Runs Behind the Scenes

Kami telah melihat bahawa Konteks Pelaksanaan Global dan Konteks Pelaksanaan Fungsi melalui langkah-langkah tertentu. Satu-satunya perbezaan ialah, dalam Konteks Pelaksanaan Global, langkah pertama ialah mencipta objek global, manakala, dalam Konteks Pelaksanaan Fungsi, langkah pertama ialah mencipta objek parameter untuk fungsi tersebut.

Kini, persoalan timbul: bagaimanakah JavaScript mengurus Konteks Pelaksanaan ini apabila ia dicipta untuk konteks global dan setiap fungsi?

Menguruskan Konteks Pelaksanaan dengan Timbunan Pelaksanaan

Untuk mengurus konteks ini, JavaScript menggunakan struktur data yang dipanggil Timbunan Pelaksanaan. Timbunan Pelaksanaan menyimpan konteks dalam cara seperti tindanan: pertama, Konteks Pelaksanaan Global, diikuti oleh setiap Konteks Pelaksanaan Fungsi. Apabila semua konteks pelaksanaan disimpan dalam tindanan, JavaScript memprosesnya satu demi satu, bermula dari bahagian atas tindanan.

Skop dengan let dan const

Adalah penting untuk ambil perhatian bahawa apabila kami mengisytiharkan pembolehubah dengan let atau const di dalam skop global atau fungsi, pembolehubah ini tidak disimpan dalam Objek Pembolehubah semasa Fasa Penciptaan, dan ia tidak dimulakan dengan tidak ditentukan. Sebaliknya, pembolehubah ini diisytiharkan secara langsung dan diberikan nilainya dalam Fasa Pelaksanaan.

Pertimbangkan contoh kod berikut:

Contoh Kod

var a = 1;

function one() {
  console.log(a);

  function two() {
    console.log(b);

    var b = 2;

    function three(c) {
      console.log(a + b + c);
    }

    three(4);
  }

  two();
}

one();

Salin selepas log masuk

Jika kami menjalankan kod ini, kami akan menghadapi ReferenceError. Ini kerana kami cuba mencetak nilai pembolehubah b sebelum mengisytiharkannya, dan kerana b diisytiharkan menggunakan const, ia berkelakuan berbeza daripada pembolehubah biasa. Pembolehubah yang diisytiharkan dengan const atau biarkan tidak disimpan dalam Objek Pembolehubah semasa Fasa Penciptaan, itulah sebabnya kami mendapat ralat semasa cuba mengaksesnya sebelum ia diberikan nilai.

Kesimpulan

Saya harap penjelasan tentang cara JavaScript berfungsi dan perkara yang berlaku semasa fasa Konteks Pelaksanaannya telah memberikan anda pemahaman yang lebih jelas. Dalam pelajaran seterusnya, kita akan meneroka topik JavaScript yang lain.

Anda boleh berhubung dengan saya di GitHub dan Linkedin.

Atas ialah kandungan terperinci Konteks Perlaksanaan JavaScript – Cara Kod JS Berjalan Di Belakang Tabir. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!