Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk Menjeda Perlaksanaan Dengan Anggun Sehingga Fungsi Asynchronous Selesai?

Bagaimana untuk Menjeda Perlaksanaan Dengan Anggun Sehingga Fungsi Asynchronous Selesai?

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-10-28 06:33:02624semak imbas

How to Gracefully Pause Execution Until an Asynchronous Function Completes?

Cara Yang Betul untuk Menjeda Pelaksanaan Sehingga Satu Fungsi Selesai

Apabila bekerja dengan berbilang fungsi tak segerak, selalunya perlu menunggu satu fungsi selesai sebelum melaksanakan yang lain. Mari kita periksa penyelesaian dan teroka pendekatan yang lebih elegan.

Penyelesaian Asal

Penyelesaian yang disediakan menggunakan mekanisme pengundian dengan setTimeout untuk terus menyemak sama ada fungsi pertama telah selesai:

<code class="javascript">var isPaused = false;

function firstFunction() {
    isPaused = true;
    // Do something
    isPaused = false;
}

function secondFunction() {
    firstFunction();
    function waitForIt() {
        if (isPaused) {
            setTimeout(waitForIt, 100);
        } else {
            // Do something else
        }
    }
}</code>

Walaupun kaedah ini boleh berfungsi, ia tidak optimum kerana pergantungannya pada pengundian.

Pendekatan Elegan

Fungsi Panggilan Balik:

Amalan biasa ialah menggunakan fungsi panggil balik untuk mengendalikan penyiapan tak segerak:

<code class="javascript">function firstFunction(callback) {
    // Do asynchronous work
    callback();
}

function secondFunction() {
    firstFunction(() => {
        console.log("huzzah, I'm done!");
    });
}</code>

Apabila firstFunction selesai, ia memanggil fungsi panggil balik, membenarkan secondFunction untuk terus melaksanakan.

Fungsi Anak Panah:

Menggunakan fungsi anak panah memudahkan pendekatan ini:

<code class="javascript">firstFunction(() => console.log('huzzah, I'm done!'))</code>

Async/Await:

Dalam JavaScript moden, async/wait menawarkan lebih mudah dibaca dan cara yang cekap untuk menjeda pelaksanaan:

<code class="javascript">const secondFunction = async () => {
  const result = await firstFunction()
  // Do something else here after firstFunction completes
}</code>

Kesimpulan

Sementara tinjauan pendapat boleh digunakan untuk menunggu fungsi selesai, fungsi panggil balik, fungsi anak panah dan async/menunggu memberikan penyelesaian yang lebih elegan dan berprestasi. Pilih pendekatan yang paling sesuai dengan keperluan khusus anda dan persekitaran JavaScript.

Atas ialah kandungan terperinci Bagaimana untuk Menjeda Perlaksanaan Dengan Anggun Sehingga Fungsi Asynchronous Selesai?. 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