Apa itu Async Await, Promise, Callback — Handling Asyncronus javascript #2
Hi, lama ga ngeblog lagi, karena tidak menyempatkan waktu haha alias banyak job hehe.
Oh iya terakhir kita bahas soal handling asyncronus menggunakan Callback function kan.., sedikit saya recap lagi ya. Callback function yakni kita memanggil sebuah fungsi didalam fungsi yang akan mengembalikan hasil dari fungsi asyncronus yang dibuat.
Kali ini saya akan menjelaskan sebuah metode yang lebih modern untuk membuat fungsi asyncronus dan juga cara mengkonsumsinya. Dengan menggunakan metode / fungsi bawaan javascript itu sendiri yakni Promise.
Apa itu promise? secara arti secara literal adalah janji. Lho kok janji gimana mksudnya itu? Jadi gini, perhatikan ilustrasi di bawah ini.
Nah saya akan sebut karakter laki-laki andi, dan mamanya. Disini andi membuat janji kepada mamanya akan membersihkan kamar, nah jika andi selesai membersihkan kamar maka andi akan pergi bermain, sedang kebalikannya jika andi tidak membersihkan kamar maka andi disuruh mencuci pakaian.
Dari algoritma sederhana tersebut, kita bisa mengira” suatu kembalian dari asyncronus kali ini berupa sebuah Promise / janji, yang akan mengembalikan 2 kemungkinan yakni resolve (diselesaikan) atau reject (ditolak).
Oke, saya kira paham dengan konsep sederhana tersebut, lanjut kita bahas secara teknisnya, keyword (kata kunci) untuk membuat Promise yakni :
Kita langsung saja ke contoh seperti kasus diatas:
Line 1, kita membuat sebuah variable untuk menampung fungsi doCleaningRoom, nah fungsi ini nih, yang mengembalikan promise.
Fungsi doCleaningRoom, mempunyai argumen isCleaning digunakan untuk mengidentifikasi apakah andi sudah membersihkan kamar atau tidak.
Line 4, mengidentifikasi apakah andi sudah membersihkan kamarnya atau belum? jika sudah maka kita panggil resolve (diselesaikan) jika tidak panggil reject (ditolak).
Fungsi asyncronus sudah dibuat, lalu bagaimana cara mengkonsumi atau menggunakan fungsi tersebut? Oke.., mari kita berkenalan dengan yang namanya fungsi then dan catch.
Apa gerangan kedua fungsi tersebut?
Then, sederhananya digunakan untuk mengambil kembalian dari resolve.
Catch, kebalikan dari Then, digunakan untuk mengambil kembalian dari reject.
Mari saya contohkan:
Line 1, kita panggil fungsi doCleanRoom dengan menambahkan sebuah parameter yang berisi tipe data boolean , semisal saya akan mengisi dengan false yang artinya andi tidak membersihkan kamar, kemudian akan mengeksekusi fungsi catch.
berikut adalah contoh hasil eksekusinya:
Nah, pemanggilan Promise ini ada dua yakni Single Call Promise dan Multi Call Promise.
Oke.., saya akan menjelaskan apa itu Multi Call Promise, mungkin sebagian akan kerepotan jika memanggil banyak promise satu per satu.
Multi Call Promise.
Untuk itu javascript menghadirkan salah satu fitur untuk memanggil banyak promise dalam satu fungsi yakni Promise.All
Jadi, apakah itu fungsi Promise.All, fungsi tersebut digunakan untuk memanggil banyak promise dalam satu fungsi.
Langsung saja kita bahas secara teknis, disini saya akan mencontohkan memanggil nama awal dan nama akhir menggunakan fungsi Promise.All.
Saya membuat 2 promise yang mengembalikan nama awal dan nama akhir, saya akan check jika salah satu nama kosong maka akan langsung reject.
Nah, untuk pemanggilan Promise.All, akan seperti ini.
Line 1, saya membuat fungsi yang akan menampung Promise.All.
Line 2, memanggil fungsi Promise.All dan mengisi parameternya, berupa array yang berisi fungsi getFirstName dan getLastName.
Line 3, panggil fungsi then, dan masukkan value berupa fungsi dengan parameter kembalian dari kedua promise awal tadi, disini bebas mau menamakan apa variabelnya, akan tetapi posisi pemanggilan harus sama seperti parameter awal, dan kemudian kita bisa melakukan apa saja terhadap variabel tadi.
Line 6, catch jika diperlukan, akan mengembalikan jika promise terkena reject.
Line 11, terakhir panggil fungsi callPromise(), untuk menjalankan fungsi.
Untuk hasil eksekusi program tersebut akan seperti ini:
Kesimpulan, ketika membuat promise lebih dari satu gunakanlah Promise.All yang akan membantu sekali, jadi cukup panggil satu fungsi untuk mengeksekusi promise yang banyak, akan tetapi ketika promise hanya satu saja tidak perlu memakai Promise.All, intinya gunakanlah secara bijak saja.
Wah, sudah lumayan banyak juga ya pembahasan tentang Promise ini, padahal mau saya bikin 2 artikel terpisah tentang Promise ini, alangkah baiknya saya bikin 1 artikel secara tuntas saja. Terima Kasih semoga faham dan mudah dimengerti.
Sekian dari tutorial ini selanjutnya saya akan membahas lagi masih tentang Async Await, apakah itu? nanti saya akan buat artikelnya ya.. daaah.
“ If you can’t stand the fatigue of studying, then you will bear the danger of stupidity ” — Imam Syafi’i
