Tanggal :3 Desember 2020

Javascript Async/Await

Artikel ini bagian ke dari 3 seri dalam artikel berseri "Belajar Javascript"

Assalamualaikum Warahmatullahi Wabarakatuh.

Halo teman-teman yang tidak pernah lelah untuk menambah ilmunya. Sebelumnya kita sudah membahas tentang Promise. Apa? Belum baca? yaudah yuk baca dulu tentang Javascript Promise.

kali ini kita akan membahas tentang Async/Await dan juga contoh penerapan sederhananya. Yaudah yuk langsung kita bahas saja tentang Javascript Async/Await.

Apa Itu Async/Await?

Async/Await merupakan sebuah syntax khusus yang digunakan untuk bekerja dengan Promise agar lebih nyaman dan mudah untuk digunakan. Async/Await terbagi menjadi Async dan Await.

Async sendiri merupakan sebuah fungsi yang mengembalikan sebuah Promise. Await sendiri merupakan fungsi yang hanya berjalan di dalam Async. Await bertujuan untuk menunda jalannya Async hingga proses dari Await tersebut berhasil dieksekusi.

Bingung ya? Yaudah langsung saja kita coba penerapannya pada pembuatan program.

Bagaimana Cara Menggunakan Async/Await?

Dalam penggunaan Async/Await, kita pertama-tama akan membuat function Async nya terlebih dahulu terlebih dahulu. Berikut merupakan bentuk code dari pembuatan function Async tersebut.

async function myAsync () {
    // Isi dari function yang akan dibuat
}

Sekarang kita akan menuliskan isi dari function tersebut. Kita akan membuat promise di dalamnya. Jika di materi Promise untuk mengakses sebuah Promise kita memerlukan method then, pada penggunaan Async, kita cukup menggunakan Await dan Await akan mengembalikan nilai dari Promise. Bentuk penggunaan dari Await dapat dicek dibawah.

async function myAsync () {
    let p = new Promise((resolve, reject) => {
        setTimeout(() => resolve("Hello World!"), 2000)
    });

    let result = await p;
    alert(result);
}

myAsync();

Code diatas merupakan penggunaan sederhana dari Async/Await pada Javascript. Berikut merupakan contoh lain dari penerapan Async/Await.

async function gitAsync (name) {
    let github = await fetch(`https://api.github.com/users/${name}`);

    let githubUser = await github.json();
    let githubImgUrl = githubUser.avatar_url;

    window.open(githubImgUrl)
}

gitAsync("denoland")

Diatas merupakan contoh penggunaan Async/Await disertai pengambilan data melalui API yang ada di github.

Kita telah membahas Async/Await pada Javascript disertai dengan contoh penggunaan sederhananya. Bagi kalian yang tertarik untuk mempelajari lebih dalam tentang Async/Await dapat mengklik link ini. Bagi kalian yang masih belum paham soal Promise, kalian bisa mengunjungi artikel Promise yang ada di website Kawan Koding dengan membuka link ini.

Jika terdapat salah kata atau terdapat kekurangan dari pembahasan ini penulis mohon maaf. Semoga materi ini dapat bermanfaat bagi para pembacanya dan sampai jumpa di pembahasan Javascript selanjutnya.

Wassalamualaikum Warahmatullahi Wabarakatuh.

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *