Rumah > hujung hadapan web > tutorial js > SetTimeout Tidak Sama seperti yang Anda Fikirkan

SetTimeout Tidak Sama seperti yang Anda Fikirkan

WBOY
Lepaskan: 2024-08-06 00:43:01
asal
677 orang telah melayarinya

Apabila pembangun mula-mula menemui setTimeout dalam JavaScript, ia selalunya kelihatan seperti alat yang mudah untuk menangguhkan pelaksanaan fungsi. Walau bagaimanapun, memahami cara setTimeout berinteraksi dengan masa jalan JavaScript dan gelung acara boleh mendedahkan beberapa tingkah laku yang tidak dijangka, terutamanya dalam keadaan tertentu. Dan ia bukan sahaja setTimeout; kerumitan serupa timbul dengan setInterval dan fungsi tak segerak yang lain juga.

Gelung Acara: Gambaran Keseluruhan Ringkas
JavaScript adalah satu-benang, bermakna ia hanya boleh melaksanakan satu keping kod pada satu masa. Walaupun begitu, gelung acara membenarkan JavaScript untuk melaksanakan operasi tanpa sekatan. Ia mencapai ini dengan memunggah tugas seperti pemasa, permintaan rangkaian atau operasi I/O ke penyemak imbas atau API Node.js. Setelah tugasan ini selesai, fungsi panggil baliknya akan digilir semula ke gelung acara untuk dilaksanakan.

SetTimeout is Not the Same as You Think

Cara setTimeout berfungsi
Apabila anda memanggil setTimeout, anda meminta enjin JavaScript untuk melaksanakan fungsi selepas tempoh tertentu. Ini dilakukan dengan menambahkan fungsi panggil balik pada baris gilir gelung acara. Walau bagaimanapun, kelewatan yang dinyatakan ialah masa minimum enjin perlu menunggu sebelum menambah panggilan balik pada baris gilir, bukan masa pelaksanaan yang dijamin. Begini cara ia berfungsi secara terperinci:

  1. Panggilan Permulaan: Apabila setTimeout digunakan dengan fungsi panggil balik dan kelewatan, enjin JavaScript mendaftarkannya dalam persekitaran API Web yang disediakan oleh penyemak imbas atau Node.js.

  2. Pemasa: API Web memulakan pemasa untuk kelewatan yang ditentukan. Dalam tempoh ini, timbunan panggilan utama terus melaksanakan sebarang kod segerak yang mengikuti panggilan setTimeout.

  3. Baris Gilir Panggilan Balik: Setelah pemasa tamat tempoh, API Web tidak segera melaksanakan panggilan balik. Sebaliknya, ia mengalihkan fungsi panggil balik ke baris gilir acara.

  4. Gelung Peristiwa: Gelung acara, yang memantau tindanan panggilan dan baris gilir acara secara berterusan, mula dimainkan. Jika tindanan panggilan kosong, bermakna tiada tugas yang sedang dilaksanakan, gelung acara mengambil fungsi pertama daripada baris gilir acara dan menolaknya ke tindanan panggilan untuk pelaksanaan.

  5. Pelaksanaan: Fungsi panggil balik akhirnya dilaksanakan apabila ia mencapai bahagian atas tindanan panggilan.

Perlu ambil perhatian bahawa jika timbunan panggilan sibuk dengan tugas lain apabila pemasa tamat tempoh, mungkin terdapat kelewatan tambahan sebelum fungsi panggil balik dilaksanakan. Ini kerana gelung peristiwa mesti menunggu sehingga tindanan panggilan jelas sebelum ia boleh memproses fungsi panggil balik daripada baris gilir acara.

SetTimeout is Not the Same as You Think


Isu Penyekatan
Salah faham biasa ialah menganggap setTimeout akan sentiasa melaksanakan panggilan balik selepas kelewatan tepat ditentukan. Jika gelung peristiwa disekat oleh kod segerak, seperti gelung tak terhingga atau pengiraan jangka panjang, panggilan balik tidak akan dilaksanakan sehingga gelung acara bebas.

Pertimbangkan senario berikut:

console.log('Program started at: ' + new Date().toLocaleTimeString());

const programStartTime = Date.now();

function blockExecutionForThirtySeconds() {
  while (true) {
    const currentTime = Date.now();
    if (currentTime - programStartTime > 30000) {
      console.log('Blocking execution completed after 30 seconds...');
      return true;
    }
  }
}

console.log('Setting setTimeout for 1 second.');
setTimeout(() => {
  console.log('setTimeout executed after 30 seconds instead of 1 second: ' + new Date().toLocaleTimeString());
}, 1000);

blockExecutionForThirtySeconds();

Salin selepas log masuk

Dalam contoh ini, fungsi blockExecutionForThirtySeconds menyekat gelung peristiwa dengan gelung tak terhingga yang berjalan selama 30 saat. Walaupun setTimeout ditetapkan untuk dilaksanakan selepas 1 saat, ia hanya akan dijalankan selepas blockExecutionForThirtySeconds selesai, iaitu selepas 30 saat.

SetTimeout is Not the Same as You Think

Implikasi Dunia Sebenar
Memahami tingkah laku ini adalah penting untuk pembangun, terutamanya apabila menulis kod yang melibatkan tamat masa, selang waktu atau pemprosesan tak segerak. Salah faham cara setTimeout berfungsi boleh membawa kepada isu prestasi dan pepijat yang sukar dikesan. Jika sekeping kod melakukan pengiraan berat atau tugasan yang berjalan lama dan menyekat gelung acara, semua panggilan balik setTimeout, resolusi janji dan operasi tak segerak lain akan ditangguhkan sehingga gelung acara bebas.

Kesimpulan
setTimeout ialah alat yang berkuasa dalam JavaScript untuk menangguhkan pelaksanaan kod, tetapi penting untuk memahami nuansanya. Kelewatan yang dinyatakan ialah masa minimum untuk menunggu sebelum fungsi boleh dibariskan untuk pelaksanaan. Masa pelaksanaan sebenar bergantung pada keadaan gelung acara. Menguasai operasi tak segerak dan pengurusan gelung acara adalah kunci untuk menulis aplikasi JavaScript yang cekap dan responsif.

Atas ialah kandungan terperinci SetTimeout Tidak Sama seperti yang Anda Fikirkan. 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