Promises & Async/Await

JavaScript di browser hidup dalam arsitektur "single-headed thread". Bila ia macet menunggu API beres mengambil data, seluruh UI Website tidak bisa di-scroll dan klik.

Mengakalinya, hadirlah konsep Async, di mana ia melempar proses pengambilan data ke back-door browser, dan menjanjikan (Promise) akan mengabari saat datanya jadi.

Async / Await

Gaya modern untuk menangkap *Promise* tanpa teknik callback bersarang di dalam .then() yang bisa menciptakan "Callback Hell", dinamakan fungsi gabungan sintaks *Async/Await*.

main.js

// 1. Tanam asersi bahwa ini adalah Async Function
const fetchUserData = async () => {
    try {
        // 2. Await: Jangan ke baris bawahnya sebelum janji ini terpenuhi (fetching API)
        const response = await fetch("https://jsonplaceholder.typicode.com/users/1");
        // 3. Await pembongkaran body respon ke JSON murni
        const user = await response.json();
        console.log(`Data User Berhasil Dicapai: ${user.name}`);
    } catch (error) {
        console.error("Gagal menarik data:", error);
    }
}
fetchUserData();