Dalam tutorial ini, anda akan belajar mengenai JavaScript async / menunggu kata kunci dengan bantuan contoh.
Anda menggunakan asynckata kunci dengan fungsi untuk menunjukkan bahawa fungsi tersebut adalah fungsi tak segerak. Fungsi async mengembalikan janji.
Sintaks asyncfungsi adalah:
async function name(parameter1, parameter2,… paramaterN) ( // statements )
Di sini,
- nama - nama fungsi
- parameter - parameter yang diteruskan ke fungsi
Contoh: Fungsi Async
// async function example async function f() ( console.log('Async function.'); return Promise.resolve(1); ) f();
Pengeluaran
Fungsi async.
Dalam program di atas, asynckata kunci digunakan sebelum fungsi untuk menunjukkan bahawa fungsi tersebut tidak segerak.
Oleh kerana fungsi ini mengembalikan janji, anda boleh menggunakan kaedah rantai then()seperti ini:
async function f() ( console.log('Async function.'); return Promise.resolve(1); ) f().then(function(result) ( console.log(result) ));
Pengeluaran
Fungsi async 1
Dalam program di atas, f()fungsi diselesaikan dan then()kaedahnya dijalankan.
JavaScript menunggu Kata Kunci
Kata awaitkunci digunakan di dalam asyncfungsi untuk menunggu operasi tidak segerak.
Sintaks untuk menggunakan menunggu adalah:
let result = await promise;
Penggunaan awaitjeda fungsi async sehingga janji mengembalikan nilai hasil (menyelesaikan atau menolak). Sebagai contoh,
// a promise let promise = new Promise(function (resolve, reject) ( setTimeout(function () ( resolve('Promise resolved')), 4000); )); // async function async function asyncFunc() ( // wait until the promise resolves let result = await promise; console.log(result); console.log('hello'); ) // calling the async function asyncFunc();
Pengeluaran
Janji diselesaikan halo
Dalam program di atas, Promiseobjek dibuat dan ia dapat diselesaikan setelah 4000 milisaat. Di sini, asyncFunc()fungsi ditulis menggunakan asyncfungsi.
Kata awaitkunci menunggu janji selesai (menyelesaikan atau menolak).
let result = await promise;
Oleh itu, hello dipaparkan hanya setelah nilai janji tersedia untuk pemboleh ubah hasil.
Dalam program di atas, jika awaittidak digunakan, hello ditampilkan sebelum Janji diselesaikan.
Mengendalikan fungsi async / tunggu
Catatan : Anda awaithanya boleh menggunakan fungsi async sahaja.
Fungsi async membolehkan kaedah asynchronous dijalankan dengan cara yang seakan-akan segerak. Walaupun operasi tersebut tidak segerak, nampaknya operasi tersebut dijalankan secara serentak.
Ini berguna sekiranya terdapat banyak janji dalam program ini. Sebagai contoh,
let promise1; let promise2; let promise3; async function asyncFunc() ( let result1 = await promise1; let result2 = await promise2; let result3 = await promise3; console.log(result1); console.log(result1); console.log(result1); )
Dalam program di atas, awaitmenunggu setiap janji selesai.
Ralat Mengendalikan
Semasa menggunakan asyncfungsi, anda menulis kod secara serentak. Dan anda juga boleh menggunakan catch()kaedah untuk mengatasi kesalahan tersebut. Sebagai contoh,
asyncFunc().catch( // catch error and do something )
Cara lain untuk mengatasi ralat adalah dengan menggunakan try/catchblok. Sebagai contoh,
// a promise let promise = new Promise(function (resolve, reject) ( setTimeout(function () ( resolve('Promise resolved')), 4000); )); // async function async function asyncFunc() ( try ( // wait until the promise resolves let result = await promise; console.log(result); ) catch(error) ( console.log(error); ) ) // calling the async function asyncFunc(); // Promise resolved
Dalam program di atas, kami telah menggunakan try/catchblok untuk menangani kesalahan. Sekiranya program berjaya dijalankan, ia akan menuju ke tryblok. Dan jika program tersebut menimbulkan ralat, program akan masuk ke catchblok.
Untuk mengetahui lebih lanjut mengenai try/catchsecara terperinci, kunjungi JavaScript JavaScript cuba / tangkap.
Faedah Menggunakan Fungsi async
- Kodnya lebih mudah dibaca daripada menggunakan panggilan balik atau janji.
- Ralat pengendalian lebih mudah.
- Penyahpepijatan lebih mudah.
Catatan : Kedua kata kunci async/awaitini diperkenalkan dalam versi JavaScript yang lebih baru (ES8). Beberapa penyemak imbas yang lebih tua mungkin tidak menyokong penggunaan async / waiting. Untuk mengetahui lebih lanjut, lawati async JavaScript / tunggu sokongan penyemak imbas.
