Mengatasi Sifat Asyncronus Javascript Dengan Promise

belajar promise asnyc await pada javascript - Halo.. Selamat datang di artikel TB kali ini. Pada kesempatan kali ini saya akan kasih ilmu seputar pemrograman web. Sesuai judul, artikel kali ini akan membahas bahasa pemrograman yang cukup populer di kalangan developer web, yaitu javascript.

Javascript itu bahasa pemrograman yang awalnya digunakan untuk client side. Tapi sekarang, bahasa ini udah bisa digunakan di server side. Dan udah mulai banyak developer yang murtad dari bahasa server side yang tenar sebelumnya, yaitu PHP, ke Javascript.

Ketika belajar javascript, hal yang cukup membuat perut saya bingung dan kepala saya mules adalah sifat asyncronusnya. Seperti yang kita ketahui, Asyncronus memang udah jadi sifat javascript sejak dilahirkan.

Baca Juga: Cara Kerja Socket.io di Node Js + Source Code

Sifat Asyncronus Tuh Paan?
Bicara soal Asyncronus, maka kita akan kenalan sama lawannya, yaitu Syncronus

Syncronus adalah proses pemuatan kode yang prosesnya berjalan secara bergantian. Jika kode sebelumnya belum dieksekusi, maka kode berikutnya harus menunggu result dari fungsi kode sebelumnya. Jika sudah, baru kode berikutnya berjalan.

Sedangkan Asyncronus adalah proses pemuatan kode yang berjalan gak kenal tunggu-tungguan. Walaupun kode sebelumnya masih proses eksekusi, kode lain sudah dijalankan duluan..
(le asyncronus: bodok amat anying.. langsung gasak aee)

Berikut ini gambarannya..

Sifat asyncronus ini berguna banget untuk membuat situs web yang lebih cepat. Tapi di beberapa kasus, sifat ini justru mengganggu.

Karena banyaknya masalah yang timbul, maka munculah fitur baru dari javascript yang bernama Promise.

Promise Tuh Paan?
Sepertinya setelah baca ulasan saya tadi, pembaca yang cerdas dan soleh udah tau apa itu Promise.

Promise adalah blok kode yang digunakan untuk menghandle sifat asyncronus javascript. Cara kerjanya dengan ngasih perintah ke sebuah fungsi kode agar dieksekusi setelah kode sebelumnya selesai dijalankan. Sintak yang digunakan untuk memberi perintah ke blok kode adalah async dan await.

Berikut ini struktur kode dari promise

let variable_contoh = new Promise((resolve, reject) => {
   //
})

Sintak async digunakan untuk function yang ingin dijalankan secara syncronus, dan await digunakan untuk blok kode yang harus dijalankan setelah semua kode dalam sintak async keload. Pusing..? :V

Dari awal sampe sini kan udah teori semua. Sekarang kita langsung praktek ke kodenya supaya lebih paham.

Contoh Sifat Asyncronus.

function contoh() {
  setTimeout(function() {
    console.log("Saya duluan")
  }, 1000)
  console.log("Saya belakangan")
}

contoh() // menjalankan fungsi contoh

resultnya pasti akan keluar "Saya belakangan" di log. Kemudian selang 1 detik, baru keluar "Saya duluan". Padahal log "Saya duluan" ditulis duluan.. :v

Itu akibat dari sifat asyncronus. Karena kode masih diproses selama 1 detik, sistem langsung gasak kode berikutnya.

Handle Asyncronus dengan Promise

async function contoh() {
  let promise = new Promise((resolve, reject) => {
    setTimeout(() => resolve("Saya duluan"), 1000)
  })

  let hasil = await promise // menunggu hasil promise

  console.log(hasil)
  console.log('Saya belakangan')
}

contoh() // menjalankan fungsi contoh

hasilnya akan keluar "Saya duluan" di log dengan selang 1 detik, kemudian baru diikuti "Saya belakangan".

Ternyata belajar beginian bingungnya udah lama, baru tau jalan mudahnya.. wkwk

Oke, sekain artikel kali ini tentang cara handle asyncronus javascript. Semoga bermanfaat! Terima kasih!