Jawapan Teknikal: Mekanisme Perlaksanaan JavaScript

Artikel ini membawakan kepada anda beberapa isu yang berkaitan dengan mekanisme pelaksanaan dalam JavaScript Sama ada kerja atau temu duga, kita mungkin sering menghadapi senario di mana kita perlu mengetahui susunan pelaksanaan kod tersebut .

Proses dan Benang

Kita semua tahu bahawa teras komputer ialah CPU, yang menganggap Ia mengendalikan semua tugas pengkomputeran adalah pengurus komputer, yang bertanggungjawab untuk penjadualan tugas, peruntukan sumber dan pengurusan, dan memerintah seluruh perkakasan komputer program adalah program dengan fungsi tertentu, dan program dijalankan pada sistem pengendalian.

Proses

Proses ialah proses pelaksanaan dinamik program dengan fungsi bebas pada set data Unit bebas untuk peruntukan sumber dan penjadualan dalam sistem Ia adalah pembawa untuk aplikasi berjalan. Proses adalah unit terkecil yang boleh memiliki sumber dan berjalan secara bebas.

Ciri-ciri proses:

• Dinamik: Proses ialah proses pelaksanaan program ia bersifat sementara, mempunyai jangka hayat dan dijana secara dinamik.

• Selaras: sebarang proses boleh dilaksanakan serentak dengan proses lain; unit bebas peruntukan dan penjadualan;

• Struktur: Proses ini terdiri daripada tiga bahagian: program, data dan blok kawalan proses.

Benang

Benang ialah proses kawalan berjujukan tunggal dalam pelaksanaan program dan unit terkecil aliran pelaksanaan program , ialah unit asas penjadualan dan penghantaran pemproses. Sesuatu proses boleh mempunyai satu atau lebih utas, dan setiap utas berkongsi ruang memori program (iaitu, ruang memori proses). Benang standard terdiri daripada ID benang, penunjuk arahan semasa (PC), daftar dan tindanan. Proses ini terdiri daripada ruang ingatan (kod, data, ruang proses, fail terbuka) dan satu atau lebih benang. Perbezaan antara proses dan utas

Thread ialah unit terkecil pelaksanaan program, manakala proses ialah unit terkecil peruntukan sumber oleh sistem pengendalian;

• Proses terdiri daripada satu atau lebih utas ialah laluan pelaksanaan kod yang berbeza dalam proses; benang di bawah proses yang sama Ruang memori program (termasuk segmen kod, set data, timbunan, dsb.) dan beberapa sumber peringkat proses (seperti fail terbuka dan isyarat) dikongsi antara mereka, dan proses tidak dapat dilihat oleh setiap lain;

• Penjadualan dan penukaran: Penukaran konteks benang jauh lebih cepat daripada penukaran konteks proses.

• Mengapa JS benang tunggal?

• JavaScript telah menjadi bahasa skrip penyemak imbas sejak kelahirannya Ia digunakan terutamanya untuk mengendalikan interaksi pengguna dan mengendalikan DOM Ini menentukan bahawa ia hanya boleh menjadi satu utas, jika tidak ia akan Membawa isu penyegerakan yang sangat kompleks.

Untuk memanfaatkan kuasa pengkomputeran CPU berbilang teras, HTML5 mencadangkan piawaian Pekerja Web, yang membenarkan skrip JavaScript mencipta berbilang rangkaian, tetapi urutan anak dikawal sepenuhnya oleh utas utama dan mesti tidak mengendalikan DOM. Oleh itu, piawaian baharu ini tidak mengubah sifat satu benang JavaScript

Komponen penyemak imbas

Enjin penyemak imbas: menghantar arahan antara antara muka pengguna dan enjin pemaparan

• Enjin pemaparan: digunakan untuk melukis kandungan yang diminta

• Rangkaian: digunakan untuk menyelesaikan panggilan rangkaian, seperti permintaan http, ia mempunyai antara muka bebas platform dan boleh berfungsi pada platform yang berbeza

• JavaScript penterjemah: digunakan Parse dan laksanakan JavaScript kod

• Halaman belakang antara muka pengguna: digunakan untuk melukis widget asas, seperti kotak kombo dan tingkap, dan antara muka pengguna asas sistem pengendalian

• Storan data: Ia tergolong dalam lapisan kegigihan Penyemak imbas menyimpan pelbagai data yang serupa dengan kuki pada cakera keras HTML5 mentakrifkan teknologi pangkalan data web, yang merupakan teknologi storan sisi pelanggan yang ringan dan lengkap

.
• Nota: Tidak seperti kebanyakan penyemak imbas, setiap tab dalam Google Chrome sepadan dengan contoh enjin pemaparan. Setiap tab ialah proses bebas

• Apakah proses yang terkandung dalam penyemak imbas?

Proses penyemak imbas

Proses utama pelayar (bertanggungjawab untuk penyelarasan dan kawalan), hanya ada satu proses

Proses pemalam pihak ketiga

Bertanggungjawab mengurus pemalam pihak ketiga

proses GPU

Bertanggungjawab untuk pemaparan 3D dan pecutan perkakasan (paling banyak satu)

Proses pemaparan

bertanggungjawab untuk penghuraian, pelaksanaan dan pemaparan dokumen halaman

Urutan apakah yang termasuk dalam proses pemaparan

benang pemaparan GUI

Terutamanya bertanggungjawab untuk menghuraikan HTML, CSS, membina DOM pokok, susun atur, lukisan, dsb.

Urutan ini saling eksklusif dengan utas enjin JavaScript Apabila enjin JavaScript dijalankan, utas pemaparan GUI akan digantung Apabila baris gilir tugasan melahu, yang utama benang akan melaksanakan pemaparan GUI

Benang enjin JavaScript

bertanggungjawab terutamanya untuk memproses skrip JavaScript , melaksanakan kod (seperti enjin V8)

Pelayar hanya boleh mempunyai satu benang enjin JS yang menjalankan program JS pada masa yang sama, iaitu, JS berbenang tunggal

Benang enjin JS dan benang pemaparan GUI adalah saling eksklusif Ditolak, jadi enjin JS akan menyekat pemaparan halaman

Benang pencetus masa

Bertanggungjawab untuk melaksanakan fungsi pemasa (setTimeout, setInterval)

Pelayar Pembilang pemasaan tidak dikira oleh enjin JS (kerana JS adalah single-threaded, jika ia disekat, ia akan menjejaskan ketepatan kaunter)

Masa dan mencetuskan pemasaan melalui benang yang berasingan (selepas pemasaan selesai, tambahkannya ke Sekiranya berlaku baris gilir urutan pencetus peristiwa, tunggu enjin JS melahu dan laksanakan). kurang daripada 4ms Selang masa dikira sebagai 4ms

bertanggungjawab untuk menyerahkan acara yang disediakan kepada benang enjin JS untuk dilaksanakan

Apabila peristiwa dicetuskan, Urutan ini akan menambah acara yang sepadan pada penghujung baris gilir untuk diproses, menunggu enjin JS memproses

Selepas sambungan XMLHttpRequest, penyemak imbas akan membuka apabila utas

mengesan perubahan status permintaan, jika terdapat fungsi panggil balik yang sepadan, utas permintaan tak segerak akan menjana peristiwa perubahan status dan meletakkan fungsi panggil balik yang sepadan ke dalam baris gilir untuk menunggu enjin JS melaksanakan

Penyegerakan dan tak segerakMemandangkan JavaScript adalah satu benang, ini menentukan bahawa tugasnya tidak boleh hanya menjadi tugas segerak Jika tugasan yang mengambil masa yang lama juga Melaksanakan tugas segerak akan menyebabkan penyekatan halaman, jadi tugas JavaScript biasanya dibahagikan kepada dua kategori:

Tugasan segerak rujuk pada utas utama Untuk tugasan beratur untuk pelaksanaan, tugasan seterusnya hanya boleh dilaksanakan selepas tugasan sebelumnya telah dilaksanakan; . dilaksanakan akan tugas memasuki utas utama untuk pelaksanaan.

Tugas tak segerak biasa: pemasa, ajax, pengikatan acara, fungsi panggil balik, janji, async menanti, dsb.

Tugas segerak dan tak segerak masing-masing memasukkan pelaksanaan berbeza" "Tempatkan ", masukkan utas utama secara serentak, masukkan Jadual Acara secara tidak segerak dan daftarkan fungsi.

Apabila perkara yang dinyatakan dalam Jadual Acara selesai, fungsi ini akan dialihkan ke Barisan Acara.

• Tugas dalam utas utama kosong selepas pelaksanaan.

• Proses di atas akan diulang secara berterusan, yang selalunya dipanggil Event Loop.

• Kami tidak boleh tidak bertanya, bagaimana kami tahu bahawa timbunan pelaksanaan utas utama kosong? Terdapat proses pemantauan dalam enjin js, yang akan memeriksa secara berterusan sama ada tindanan pelaksanaan utas utama kosong Setelah ia kosong, ia akan pergi ke Baris Gilir Acara untuk menyemak sama ada terdapat fungsi yang menunggu untuk dipanggil.

Tugas makro dan tugas mikro
Selain tugas segerak dan tugas tak segerak dalam erti kata yang luas, JavaScript juga mempunyai tugas yang lebih terperinci Takrifan tugas:

Makro-tugas: termasuk kod global, setTimeout, setInterval

Micro-task ： new Promise() .then(callback) process.nextTick()

• Jenis tugasan yang berbeza akan memasuki baris gilir tugas yang berbeza:

• Turutan gelung acara menentukan susunan pelaksanaan kod js. Selepas memasukkan kod keseluruhan (tugas makro), kitaran pertama bermula. Kemudian laksanakan semua tugas mikro. Kemudian mulakan dari tugas makro sekali lagi, cari salah satu baris gilir tugasan untuk dilaksanakan, dan kemudian laksanakan semua tugasan mikro.

Kod JavaScript dilaksanakan dalam konteks pelaksanaan Terdapat tiga konteks pelaksanaan dalam JavaScript:

function add(){
  console.log(1)
  foo()
  console.log(3)
}
function foo(){
  console.log(2)
}
add()

(async ()=>{
    console.log(1) 
  
    setTimeout(() => {
    console.log('setTimeout1')
    }, 0);
  
    function foo (){
        return new Promise((res,rej) => {
            console.log(2)
            res(3)
        })
    }
  
    new Promise((resolve,reject)=>{
    console.log(4)
    resolve() 
    console.log(5)
    }).then(()=> {
    console.log('6')
    })
  
    const res = await foo();
    console.log(res);
    console.log('7')
  
    setTimeout(_ => console.log('setTimeout2'))
})()

Atas ialah kandungan terperinci Jawapan Teknikal: Mekanisme Perlaksanaan JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!