Advance JavaScript 21 - asyn await

Advance JavaScript 21 - asyn await

Async/await adalah fitur baru dalam JavaScript yang memungkinkan penulisan kode asinkron dengan cara yang lebih mudah dibaca dan dipahami, tanpa perlu menggunakan callback atau chaining promise secara ekstensif. Ini mengubah cara penulisan kode asinkron menjadi lebih mirip dengan kode sinkronus

Cara Menggunakan Async/Await:

async function fetchData() {
  try {
    const response = await fetch('https://api.example.com/data');
    if (!response.ok) {
      throw new Error('Terjadi kesalahan: ' + response.status);
    }
    const data = await response.json();
    console.log('Data yang diperoleh:', data);
  } catch (error) {
    console.error('Terjadi kesalahan:', error);
  }
}
```

Dalam contoh di atas:

- Kata kunci `async` digunakan sebelum deklarasi fungsi untuk menunjukkan bahwa fungsi tersebut adalah sebuah async function.
- Kata kunci `await` digunakan dalam async function untuk menunggu hasil dari ekspresi yang mengembalikan promise. Ini membuat eksekusi kode di dalam fungsi async berhenti sampai promise di-resolve atau di-reject, dan kemudian melanjutkan eksekusi setelahnya.
- Dalam contoh tersebut, `await fetch(...)` digunakan untuk mengambil data dari server, dan `await response.json()` digunakan untuk mengonversi respons ke dalam bentuk JSON.

Async/await memudahkan penulisan kode asinkron dengan menghilangkan kompleksitas callback atau chaining promise, dan membuatnya lebih mudah dipahami, terutama untuk pengembangan aplikasi yang kompleks.

Tentu, berikut adalah penjelasan detail tentang Async/Await dalam JavaScript, bersama dengan contoh penggunaan nyata:

### Apa itu Async/Await?

Async/Await adalah fitur dalam JavaScript yang memungkinkan penulisan kode asinkron secara lebih mudah dan terbaca, tanpa perlu menggabungkan callback atau menggunakan promise secara langsung. Ini memungkinkan kita untuk menulis kode asinkron seperti menulis kode sinkronus.

Cara Menggunakan Async/Await:

async function fetchData() {
  try {
    const response = await fetch('https://api.example.com/data');
    if (!response.ok) {
      throw new Error('Terjadi kesalahan: ' + response.status);
    }
    const data = await response.json();
    console.log('Data yang diperoleh:', data);
    return data;
  } catch (error) {
    console.error('Terjadi kesalahan:', error);
    throw error;
  }
}
```

Dalam contoh di atas:

- Kata kunci `async` digunakan sebelum deklarasi fungsi untuk menandakan bahwa fungsi tersebut adalah async function.
- Kata kunci `await` digunakan dalam async function untuk menunggu hasil dari ekspresi yang mengembalikan promise. Ini membuat eksekusi kode di dalam fungsi async berhenti sampai promise di-resolve atau di-reject, dan kemudian melanjutkan eksekusi setelahnya.
- Dalam contoh tersebut, `await fetch(...)` digunakan untuk mengambil data dari server, dan `await response.json()` digunakan untuk mengonversi respons ke dalam bentuk JSON.

Contoh Penggunaan Nyata:

async function getDataAndProcess() {
  try {
    const data = await fetchData();
    // Proses data yang diperoleh
    console.log('Data yang diproses:', data);
  } catch (error) {
    // Tangani kesalahan jika terjadi
    console.error('Gagal memproses data:', error);
  }
}

// Memanggil async function
getDataAndProcess();
```

Dalam contoh ini, `getDataAndProcess` adalah async function yang memanggil `fetchData` untuk mengambil data dari server. Setelah data diperoleh, data tersebut dapat diproses lebih lanjut. Jika ada kesalahan dalam pengambilan atau pemrosesan data, async/await akan menangani kesalahan tersebut dengan menggunakan blok `try...catch`.