𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁 𝗦𝗶𝗻𝗸𝗿𝗼𝗻𝘂𝘀 𝗱𝗮𝗻 𝗔𝘀𝗶𝗻𝗸𝗿𝗼𝗻𝘂𝘀
JavaScript berjalan pada satu thread tunggal. Ini bermakna ia melaksanakan satu perkara pada satu masa. Anda perlu memahami cara ia mengendalikan tugasan untuk menulis kod yang cekap.
JavaScript Sinkronus
Kod sinkronus berjalan baris demi baris. Setiap tugasan menunggu tugasan sebelumnya selesai. Ini dipanggil penyekatan (blocking). Jika satu tugasan mengambil masa yang lama, keseluruhan program akan terhenti.
- Pelaksanaan: Urutan tetap.
- Penyekatan (Blocking): Ya.
- Kerumitan: Mudah.
- Terbaik untuk: Tugasan ringkas dan berurutan.
JavaScript Asinkronus
Kod asinkronus berjalan secara bebas. Tugasan tidak menyekat kod lain semasa ia menunggu. Ini dipanggil tidak menyekat (non-blocking). Tugasan bermula di latar belakang dan akan memaklumkan anda apabila ia selesai.
- Pelaksanaan: Tugasan berjalan secara bebas.
- Penyekatan (Blocking): Tidak.
- Kerumitan: Lebih tinggi.
- Terbaik untuk: Panggilan API, pemasa (timers), dan operasi fail.
Tiga cara untuk mengendalikan tugasan asinkronus:
- Callbacks: Fungsi yang berjalan selepas tugasan selesai.
- Promises: Objek yang mewakili penyelesaian atau kegagalan sesuatu operasi.
- Async/Await: Kaedah yang paling bersih. Ia menjadikan kod asinkronus kelihatan seperti kod sinkronus tanpa menyekat thread.
Operasi asinkronus yang biasa:
- Pemasa: setTimeout()
- Panggilan API: fetch()
- Pembacaan fail: readFile()
- Acara pengguna: addEventListener()
Event Loop membolehkan perkara ini berfungsi. Ia menggunakan Call Stack, Web APIs, dan Callback Queue untuk menguruskan pelbagai tugasan secara serentak.
Ringkasan:
- Sinkronus: Satu demi satu. Menyekat pelaksanaan.
- Asinkronus: Tugasan bebas. Tidak menyekat.
- Lalai (default) JavaScript: Sinkronus.
Source: https://www.geeksforgeeks.org/javascript/synchronous-and-asynchronous-in-javascript/ Source: https://www.w3schools.com/js/js_asynchronous.asp Source: https://medium.com/@mohdtalib.dev/what-is-synchronous-and-asynchronous-in-javascript-07adb7b4cc5f
Full post: https://dev.to/raja_b_0c9d242e2c26cf063b/javascript-synchronous-and-asynchronous-2a69