Rumah >hujung hadapan web >tutorial js >Bagaimanakah Saya Boleh Menjalankan Berbilang Operasi Async Secara serentak dalam JavaScript?

Bagaimanakah Saya Boleh Menjalankan Berbilang Operasi Async Secara serentak dalam JavaScript?

Patricia Arquette
Patricia Arquetteasal
2024-12-07 22:41:171031semak imbas

How Can I Run Multiple Async Operations Concurrently in JavaScript?

Pelaksanaan Serentak Berbilang Operasi Async

Masalah:

Dalam kod di bawah, operasi async dilaksanakan secara berurutan, bukan serentak:

const value1 = await getValue1Async();
const value2 = await getValue2Async();

Untuk menjalankan operasi secara serentak, kami perlu mengubah suai kod.

Penyelesaian:

TL;DR

Gunakan Promise.all dan bukannya menunggu berurutan corak:

const [value1, value2] = await Promise.all([getValue1Async(), getValue2Async()]);

Butiran:

Penyelesaian asal menjalankan kedua-dua operasi secara selari tetapi menunggu yang pertama selesai sebelum menunggu yang kedua. Ini boleh membawa kepada isu prestasi jika satu operasi mengambil masa yang lebih lama daripada yang lain.

Promise.all membolehkan kami menunggu beberapa operasi selesai serentak. Ia memerlukan pelbagai janji dan mengembalikan janji yang diselesaikan kepada tatasusunan hasil dalam susunan yang sama seperti tatasusunan asal.

Kelebihan Promise.all:

  • Pelaksanaan operasi serentak
  • Mengendalikan penolakan dengan betul jika ada janji tolak
  • Kod yang lebih ringkas

Awas:

Perhatikan bahawa jika janji kedua menolak sebelum janji pertama diselesaikan, "dapatkan janji kemudian tunggu ia" corak boleh mengakibatkan ralat "penolakan tidak dikendalikan". Ini boleh dielakkan dengan menggunakan Promise.all.

Contoh:

Berikut ialah contoh yang disemak menggunakan Promise.all:

const getValue1Async = () => {
  return new Promise(resolve => {
    setTimeout(resolve, 500, "value1");
  });
};

const getValue2Async = () => {
  return new Promise((resolve, reject) => {
    setTimeout(reject, 100, "error");
  });
};

(async () => {
  try {
    console.time("Promise.all");
    const [value1, value2] = await Promise.all([getValue1Async(), getValue2Async()]);
  } catch (e) {
    console.timeEnd("Promise.all", e);
  }
})();

Kod ini menunjukkan cara Promise.all mendayakan pelaksanaan serentak kedua-dua operasi async, menghasilkan lebih pantas selesai.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menjalankan Berbilang Operasi Async Secara serentak dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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