Rumah > hujung hadapan web > tutorial js > Gelung Acara JavaScript

Gelung Acara JavaScript

王林
Lepaskan: 2024-08-28 06:10:06
asal
1139 orang telah melayarinya

Apakah itu Gelung Acara JavaScript?

Dalam JavaScript, gelung peristiwa ialah mekanisme yang mengawal pelaksanaan kod, peristiwa atau mesej menggunakan I/O tidak menyekat. Ini menyediakan cara untuk operasi tidak menyekat, atau tak segerak, dalam JavaScript.

Konsep Utama

1. Berbenang Tunggal
JavaScript adalah satu benang, yang bermaksud ia melaksanakan satu tugas pada satu masa. Oleh itu, satu urutan, satu urutan yang JavaScript dilaksanakan ialah apa yang dipanggil "benang utama.

2.Timbunan Panggilan
Ia ialah struktur data di mana JavaScript menjejaki panggilan fungsi. Panggilan fungsi ditolak ke tindanan. Apabila ia kembali, ia dikeluarkan. Apabila ia kosong, JavaScript bersedia untuk memproses perkara seterusnya. Ia juga biasanya dirujuk sebagai "benang utama".

3.Timbunan
Di sinilah JavaScript menyimpan objek dan pembolehubah. Ia digunakan untuk peruntukan memori dinamik.

4.Barisan Acara
Barisan mesej atau tugasan yang sedang menunggu untuk dilaksanakan. Apabila tugasan ditambahkan ke dalam baris gilir, ia menunggu timbunan panggilan kosong untuk dilaksanakan.

5.Gelung Acara
Ia adalah sesuatu yang sentiasa memantau timbunan panggilan dan baris gilir acara. Jika tindanan panggilan kosong, ia kemudian mengalihkan tugasan daripada baris gilir acara ke dalam tindanan panggilan dan melaksanakannya.

JavaScript Event Loop

Proses

  • Pelaksanaan Kod: Apabila JavaScript mula melaksanakan kod, ia menolak panggilan fungsi ke tindanan panggilan. Selain itu, ia melaksanakan satu demi satu fungsi.
  • Operasi Asynchronous: Serta-merta operasi tidak segerak, seperti setTimeout atau permintaan rangkaian, JavaScript tidak menyekat pelaksanaan. Sebaliknya, ia memajukan operasi itu ke API Web, katakan kepada pemasa penyemak imbas atau kepada perkhidmatan yang mengendalikan permintaan HTTP.
  • Fungsi Panggilan Balik: Apabila operasi tak segerak selesai, fungsi panggil baliknya ditolak ke dalam baris gilir acara.

  • Pemeriksaan Gelung Peristiwa: Gelung Peristiwa kini menyemak tindanan panggilan serta baris gilir acara dalam susunan. Jika tindanan panggilan kosong, ia memilih tugas pertama daripada baris gilir acara dan menolaknya ke dalam tindanan panggilan untuk menjalankannya.

console.log('Start');

setTimeout(() => {
  console.log('Timeout 1');
}, 1000);

setTimeout(() => {
  console.log('Timeout 2');
}, 500);

console.log('End');

Salin selepas log masuk

Perhatikan bahawa perkara berikut akan berlaku langkah demi langkah:

  • Memandangkan permulaan ialah operasi segerak, ia dilog serta-merta.
  • SetMasa tamat pertama didaftarkan dengan kelewatan 1000ms dan kemudian pergi ke API Web. Panggilan baliknya akan dimasukkan ke dalam baris gilir acara selepas 1000ms.
  • SetMasa tamat kedua didaftarkan dengan kelewatan 500ms dan kemudian pergi ke API Web. Panggilan baliknya akan diletakkan dalam baris gilir acara selepas 500ms.
  • Tamat dilog segera kerana ia segerak.
  • Dalam 500ms, panggil balik untuk set keduaMasa tamat bergerak dari baris gilir acara ke timbunan panggilan dan log Tamat Masa 2.
  • Kadar pertama untuk setTimeout mengalami daripada baris gilir acara ke timbunan panggilan dalam 1000ms dan log Tamat Masa 1.

Ringkasan

  • Timbunan Panggilan: Melaksanakan fungsi mengikut tertib.
  • Baris Gilir Acara: Menyimpan mesej atau tugasan untuk dilaksanakan.
  • Gelung Acara: Ia melaksanakan tugasan, yang dihantar daripada baris gilir acara ke dalam tindanan panggilan apabila kosong.

Atas ialah kandungan terperinci Gelung Acara JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan