كيف يعمل async/await؟

Question

Accepted Answer

`async/await` هي **syntax sugar فوق Promises** تتيح لك كتابة كود غير متزامن يبدو وكأنه متزامن. دالة `async` تُرجع دائماً Promise؛ `await` توقف الدالة حتى يستقر Promise، ثم تستأنف مع قيمته.

```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 — a common performance mistake

`await` تشغل الأشياء **واحداً تلو الآخر**. إذا لم يكن لديك طلبان يعتمدان على بعضهما البعض، فإن انتظارهما بالتتابع بطيء جداً وغير فعال:

```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()]);
```

## معالجة الأخطاء

استخدم `try/catch` بدلاً من `.catch`. Promise المرفوضة المنتظرة تطرح استثناء، لذا يغطي `catch` واحد الكتلة بأكملها.

## تحت الغطاء

إنها لا تزال Promises والـ microtask queue — `await` لا تحظر الخيط؛ إنها تسلم التحكم حتى يعمل كود آخر، ثم تستأنف. لا تنسَ: استدعاء دالة `async` دون `await`ها (أو `.catch`) يمكن أن يخفي الأخطاء.

## لماذا يهم

إنها تجعل تدفقات غير المتزامنة قابلة للقراءة وهي الافتراضية الحديثة لترتيب العمل غير المتزامن — لكن يجب عليك بوعي توازي العمليات المستقلة باستخدام `Promise.all`.