Bagaimanakah async/await berfungsi?

Question

Accepted Answer

`async/await` adalah **syntax sugar berbanding Promises** yang memungkinkan Anda menulis kod asinkron yang terlihat seperti kod sinkron. Fungsi `async` sentiasa mengembalikan Promise; `await` menghentikan fungsi sehingga Promise diselesaikan, kemudian melanjutkan dengan nilainya.

```js
async function loadUser(id) {
  try {
    const res = await fetch(`/api/users/${id}`); // pause until the response
    const user = await res.json();               // pause until parsed
    return user;                                  // becomes the resolved value
  } catch (err) {
    console.error(err); // catches rejections from any await above
  }
}
```

## Sequential vs parallel — kesilapan prestasi yang biasa

`await` menjalankan perkara **satu demi satu**. Jika dua permintaan tidak bergantung antara satu sama lain, menanti mereka secara berjujukan adalah perlahan yang sia-sia:

```js
// ❌ sequential — total time = a + b
const a = await getA();
const b = await getB();

// ✅ parallel — total time = max(a, b)
const [a, b] = await Promise.all([getA(), getB()]);
```

## Pengendalian ralat

Gunakan `try/catch` sebagai ganti `.catch`. Promise yang ditolak yang ditunggu melempar, jadi satu `catch` meliputi seluruh blok.

## Di bawah penutup

Ia masih Promises dan antrian microtask — `await` tidak menghalang thread; ia menghasilkan kawalan supaya kod lain berjalan, kemudian melanjutkan. Jangan lupa: memanggil fungsi `async` tanpa `await`ing (atau `.catch`) boleh menelan ralat.

## Mengapa ia penting

Ia membuat aliran asinkron boleh dibaca dan merupakan lalai moden untuk menjujukan kerja asinkron — tetapi Anda mesti dengan sedar menyelaraskan operasi bebas dengan `Promise.all`.