DISKON TERBATAS! Masukkan kupon "skillbaru" saat checkout di kelas apa saja

Logo Koala Skodev mengetik

Skodev

Belajar coding dalam bahasa Indonesia

ASYNC AWAIT PADA JAVASCRIPT

Artikel ini menjelaskan cara kerja async dan await pada JavaScript dengan bahasa sederhana, termasuk contoh kode untuk pemahaman yang lebih mudah.

Daftar Isi:

Apa Itu `async`?
Apa Itu `await`?
Mengapa Menggunakan `async` da...
Kesimpulan

Pada JavaScript, async dan await adalah fitur yang sangat berguna untuk menangani operasi asinkron. Dengan memahami kedua konsep ini, kamu bisa menulis kode yang lebih bersih dan mudah dibaca.

Apa Itu async?

async adalah kata kunci yang digunakan untuk mendefinisikan fungsi asinkron. Fungsi asinkron akan selalu mengembalikan sebuah Promise, bahkan jika nilai yang dikembalikan bukanlah sebuah Promise.

async function contohAsync() {
  return 'Hello, World!';
}

contohAsync().then((hasil) => console.log(hasil)); // Output: Hello, World!

Pada contoh di atas, fungsi contohAsync dikembalikan sebagai Promise, dan kita dapat menggunakan then untuk mendapatkan hasilnya.

Apa Itu await?

await adalah operator yang hanya bisa digunakan di dalam fungsi async. Operator ini digunakan untuk menunggu Promise selesai sebelum melanjutkan eksekusi kode. Dengan kata lain, await memaksa JavaScript untuk menunggu sampai Promise selesai dan mengembalikan hasilnya.

async function contohAwait() {
  const hasil = await new Promise((resolve) => {
    setTimeout(() => resolve('Hello, Async/Await!'), 1000);
  });
  console.log(hasil);
}

contohAwait(); // Output setelah 1 detik: Hello, Async/Await!

Dalam fungsi contohAwait, kita menggunakan await untuk menunggu Promise selesai sebelum mencetak hasilnya ke konsol.

Mengapa Menggunakan async dan await?

Menggunakan async dan await membuat kode lebih mudah dibaca dan ditulis. Kamu tidak perlu lagi menggunakan banyak callback atau then yang bisa menyebabkan “callback hell” atau kode yang sulit dipelihara.

Menggunakan async dan await Bersama

Kamu bisa mengimplementasikan kedua konsep ini bersama dalam satu fungsi untuk menangani operasi asinkron:

async function fetchData() {
  try {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    console.log(data);
  } catch (error) {
    console.error('Terjadi kesalahan:', error);
  }
}

fetchData();

Di sini, kita menggunakan await untuk menunggu fetch selesai dan kemudian menunggu response.json() selesai. Jika ada kesalahan, blok try/catch akan menangkapnya dan mencetak pesan kesalahan.

Kesimpulan

async dan await pada JavaScript adalah alat yang kuat untuk menangani operasi asinkron dengan cara yang lebih sederhana dan bersih. Dengan menggunakan kedua konsep ini, kamu bisa menulis kode yang lebih mudah dibaca dan dijaga.

Selamat mencoba dan semoga bermanfaat!


Daftar newsletter skodev masukkan emailmu untuk dapat informasi menarik dari dunia koding