طلبات API متتابعة بالترتيب

طريقان إلى نفس الفكرة

قبل أن تبدأ

الفكرة الجوهرية

1لماذا ينقلب الترتيب

هنا نحاكي الشبكة بمؤقّتات بتأخيرات مختلفة، فلا نحتاج اتصالًا. الطلب الثالث أسرع فيطبع أولًا:

const delays = { a: 30, b: 20, c: 5 };
const fakeFetch = (id) =>
  new Promise((resolve) => setTimeout(() => resolve(`item ${id}`), delays[id]));

for (const id of ["a", "b", "c"]) {
  fakeFetch(id).then((item) => console.log("arrived:", item));
}

2Promise.all يحفظ الترتيب

نطلق كل الطلبات معًا، وننتظرها كلها، فتأتي النتائج مرتّبة حسب المدخلات:

const delays = { a: 30, b: 20, c: 5 };
const fakeFetch = (id) =>
  new Promise((resolve) => setTimeout(() => resolve(`item ${id}`), delays[id]));

async function main() {
  const items = await Promise.all(["a", "b", "c"].map(fakeFetch));
  items.forEach((item) => console.log(item));

  for (const id of ["c", "b", "a"]) {
    console.log("sequential:", await fakeFetch(id));
  }
}
main();

3تمرين: واجهة عامة حقيقية

اختر واجهة عامة مجانية بلا مفتاح تعيد كائنًا فيه قائمة روابط (مثلًا فيلم وقائمة روابط شخصياته)، واكتب سكربت Node يأخذ رقمًا من سطر الأوامر، يجلب الكائن، ثم يطبع اسم كل عنصر بنفس ترتيب القائمة. استخدم fetch المدمج في Node 18+ وprocess.argv[2]، وتعامل مع رد غير 200.

// skeleton: fill in the two TODOs
const id = process.argv[2];
const res = await fetch(`${process.env.API_BASE}/films/${id}/`);
if (!res.ok) throw new Error(`HTTP ${res.status}`);
const film = await res.json();
// TODO: fetch every link in film.characters, keeping the order
// TODO: print each name on its own line

مثال محلول

المسألة: 50 رابطًا، والواجهة تسمح بـ 10 طلبات بالثانية. التحليل: Promise.all على الخمسين يتجاوز الحد فتأتي أخطاء 429، والمتتابع بطيء. الحل: قسّم الروابط لدفعات من 10، وawait Promise.all(batch) لكل دفعة، ثم اجمع النتائج بالترتيب. سرعة معقولة وترتيب محفوظ واحترام للحد.

خرافة مقابل حقيقة

اختبر فهمك

بطاقات مراجعة سريعة

تحقق من فهمك