Rumah > hujung hadapan web > tutorial js > Memahami Operasi Asynchronous dan Menggunakan async/wait dalam JavaScript

Memahami Operasi Asynchronous dan Menggunakan async/wait dalam JavaScript

WBOY
Lepaskan: 2024-09-10 11:34:02
asal
367 orang telah melayarinya

Seperti yang anda sedia maklum, JavaScript ialah bahasa berbenang tunggal dan ia boleh melaksanakan satu tindakan pada satu masa. Walau bagaimanapun, banyak operasi dalam pembangunan web termasuk menarik data dari pelayan atau membaca fail dalam cakera boleh mengambil sedikit masa untuk diselesaikan. Jika ia melakukan operasi ini secara serentak, bermakna JavaScript perlu menunggu sehingga operasi dilakukan sebelum pergi ke baris kod seterusnya, maka ia akan memperlahankan responsif aplikasi. Untuk menyelesaikan tugas sedemikian dengan lebih cekap, teknik pengaturcaraan tak segerak guna JavaScript.

Apakah Operasi Asynchronous?

Operasi tak segerak ialah operasi yang dimulakan pada masa semasa tetapi dibenarkan selesai pada masa lain sementara program diteruskan dengan baris kod lain. Dalam JavaScript pengendalian tingkah laku tak segerak dilakukan melalui penggunaan panggilan balik, janji, dan terakhir sintaks async/menunggu. Pendekatan ini menjadikan JavaScript melaksanakan tugas di latar belakang sekali gus meningkatkan prestasi keseluruhan apl web.
Sebagai contoh, pertimbangkan kes dalam aplikasi web di mana maklumat tentang pengguna perlu diambil daripada pangkalan data. Proses ini boleh mengambil masa beberapa saat bergantung pada kelajuan rangkaian atau trafik tinggi ke pelayan. JavaScript boleh meneruskan kod yang lain dan bukannya menghentikan aplikasi sambil menunggu data diterima. Tingkah laku tidak menyekat jenis ini ialah idea asas di sebalik pengaturcaraan tak segerak.

Memperkenalkan async/menunggu

Sintaks async/waiit, yang merupakan sebahagian daripada ES2017 (ES8), boleh dikatakan cara yang paling elegan dan mudah difahami untuk menangani kod tak segerak. Ia berdasarkan Janji dan memberikan cara untuk melihat kod tak segerak seperti kod segerak untuk mudah difahami dan diselenggara.
Fungsi async ialah fungsi yang mempunyai Promise sebagai jenis pulangannya. Kata kunci async apabila dilampirkan pada fungsi memberitahu program bahawa fungsi itu akan sentiasa mengembalikan Promise tanpa mengira sama ada Promise sebenarnya dikembalikan atau tidak. Await digunakan dalam fungsi async untuk membenarkan fungsi menunggu janji untuk diselesaikan atau ditolak.

Bagaimanakah async/menunggu Berfungsi?

Sekarang izinkan saya menggambarkan dengan contoh cara menggunakan async/menunggu. Pertimbangkan coretan kod berikut yang mengambil troli beli-belah pengguna dan memaparkannya:

Understanding Asynchronous Operations and Using async/await in JavaScript

Dalam contoh ini, fungsi getCart diisytiharkan sebagai tidak segerak, oleh itu, ia boleh menggunakan kata kunci await untuk mengendalikan operasi tak segerak di dalamnya.

  1. const cart = await req.user.getCart();: Ini memanggil kaedah getCart pada objek pengguna, ini mendapatkan semula contoh cart semasa pengguna. Kata kunci await memastikan bahawa JavaScript menunggu Janji dikembalikan oleh getCart() untuk dilengkapkan. Nilai yang diselesaikan (troli pengguna) kemudiannya diberikan kepada pemboleh ubah troli.
  2. produk const = await cart.getProducts();: Begitu juga, baris ini menjeda pelaksanaan kod sehingga kaedah getProducts selesai, yang membawa produk ke dalam troli pengguna. Kata kunci tunggu memberitahu CLR bahawa baris kod berikut tidak boleh dilaksanakan sehingga data produk sedia.
  3. Memberikan Respons: Setelah selesai kedua-dua operasi tak segerak, pembolehubah res.render() dilaksanakan untuk memaparkan halaman troli bersama-sama produk.
  4. Ralat Pengendalian dengan cuba...tangkap: Cubaan...Akhir sekali, blok tangkapan digunakan untuk mengendalikan sebarang pengecualian yang mungkin timbul disebabkan oleh operasi tak segerak. Jika terdapat ralat pada mana-mana kenyataan menunggu, blok tangkapan mengendalikan ralat dan logkannya ke konsol.

Faedah menggunakan async/menunggu

Sintaks async/wait menawarkan beberapa kelebihan berbanding kod berasaskan janji tradisional:Sintaks async/wait menawarkan beberapa kelebihan berbanding kod berasaskan janji tradisional:
• Kebolehbacaan yang Dipertingkat: Ianya mudah untuk diikuti dan difahami kerana kod tersebut kelihatan seperti kod segerak biasa walaupun keupayaannya untuk mengendalikan operasi tak segerak.
• Pengendalian Ralat: Menggunakan try...Async/wait menjadikan pengendalian ralat semudah dan seragam seperti menangkap ralat dengan penyegerakan/async.
• Memudahkan Operasi Kompleks: async/tunggu harus digunakan untuk kod yang mempunyai berbilang operasi tak segerak kerana kod akan lebih mudah untuk ditulis, diuji dan dinyahpepijat.

Conclusion

Async programming is particularly crucial in JavaScript to execute computationally intensive operations without stalling the main thread. The async/await syntax offers some more sophisticated way of dealing with these operations and the code generated is more readable, cleaner and easier to debug. Async/await helps developers to write asynchronous code, which makes their application more predictable and faster.

Atas ialah kandungan terperinci Memahami Operasi Asynchronous dan Menggunakan async/wait dalam 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