جاري التحميل...

الوعود (Promises)

الكوب فقرة، #cup. يبدأ blank، والسكربت يكتب waiting قبل أن يطلب الشاي.
pour لا تُرجع المشروب. تُرجع وعدًا. تطلب من ذلك الوعد، عبر then، أن يكتب المشروب لاحقًا. السطر تحت pour ما زال يقول waiting. السطر waiting / lida tea.

ليس الكوب الذي قدّمته للتو

الصفحة السابقة مرّرت done إلى serve. serve نادت الدالة قبل الرجوع، فالسجل تحتها كان lida tea / poured. لم ينتظر شيء هناك.
هنا الدالة التي تعطيها لـ then لا تجري في السطر التالي. pour ترجع أولًا. المشروب يظهر بعد انتهاء هذا السكربت.

ثلاث حالات

الوعد pending حتى يستقر. resolve يُنجزه بقيمة. reject يرفضه بسبب. then يجري فقط عند الإنجاز. catch يجري فقط عند الرفض. لا مؤقت في هذه الصفحة. المنفّذ ينادي resolve أو reject فورًا، والمعالجات تنتظر حتى ينتهي السكربت.

📊 ثلاث حالات

الحالة ماذا ترى سهل الخلط
pending الكوب ما زال يقول waiting المشروب على الكوب من قبل
fulfilled then يستلم lida tea أن يجري catch أيضًا
rejected catch يستلم no leaves أن يستلم then المشروب

المنفّذ الآن، والمعالج ليس الآن

الدالة التي تعطيها لـ new Promise تجري فورًا. لذلك يمكن أن يحدث resolve("lida tea") قبل رجوع pour. الدالة التي تعطيها لـ then مختلفة. تُصفّ. السطر بعد pour(...) يجري والكوب ما زال يقول waiting.

السطر التالي ما زال ينتظر

pour("lida") يخزّن وعدًا في order. الكوب صار waiting. السجل تلك الكلمة، لا المشروب.

الكوب ما زال ينتظر

javascript 
function pour(order) {
return new Promise(function (resolve, reject) {
if (order === "") {
reject("no leaves");
return;
}
resolve(order + " tea");
});
}
let cup = document.getElementById("cup");
cup.textContent = "waiting";
let order = pour("lida");
console.log(cup.textContent);

السجل waiting. order هو الوعد. ليس النص lida tea.

then يستلم المشروب

نادِ then بدالة. تلك الدالة تأخذ القيمة التي مُرّرت إلى resolve. تكتب المشروب وتسجّله. هذا السجل ليس سجل السطر التالي. هو السجل داخل then.

then يكتب المشروب

javascript 
function pour(order) {
return new Promise(function (resolve, reject) {
if (order === "") {
reject("no leaves");
return;
}
resolve(order + " tea");
});
}
let cup = document.getElementById("cup");
pour("lida").then(function (drink) {
cup.textContent = drink;
console.log(cup.textContent);
});

السجل lida tea. النص الفارغ لا يصل إلى هذا المعالج.

لا أوراق شاي

pour("") تنادي reject("no leaves") وترجع. catch يستلم ذلك السبب. then لا يجري.

التقط طلبًا فارغًا

javascript 
function pour(order) {
return new Promise(function (resolve, reject) {
if (order === "") {
reject("no leaves");
return;
}
resolve(order + " tea");
});
}
pour("").catch(function (reason) {
console.log(reason);
});

السجل no leaves.

الوعد ليس المشروب

order.then دالة. بذلك تعرف أن order وعد وليس النص الذي أردته. مقارنة الوعد بـ "lida tea" تكون خاطئة، وهذا المقطع يطبع نوع then فقط.

then دالة

javascript 
function pour(order) {
return new Promise(function (resolve, reject) {
if (order === "") {
reject("no leaves");
return;
}
resolve(order + " tea");
});
}
let order = pour("lida");
console.log(typeof order.then);

السجل function.

السطر تحت الكوب

السكربت يجعل الكوب waiting ويدفع تلك الكلمة فورًا. then يدفع lida tea ويجمع الكلمتين. الجمع داخل then، فيحدث بعد السكربت لا في السطر التالي.

عرض الصفحة — كوب موعود

html 
<!DOCTYPE html>
<html>
<head>
<title>promised-cup — page</title>
</head>
<body>
<p id="cup">blank</p>
<p id="line">…</p>
<script>
function pour(order) {
return new Promise(function (resolve, reject) {
if (order === "") {
reject("no leaves");
return;
}
resolve(order + " tea");
});
}
let cup = document.getElementById("cup");
let seen = [];
cup.textContent = "waiting";
seen.push(cup.textContent);
pour("lida").then(function (drink) {
seen.push(drink);
cup.textContent = drink;
document.getElementById("line").textContent = seen.join(" / ");
});
</script>
</body>
</html>

السطر waiting / lida tea. waiting كان فوريًا. lida tea وصل في then. كلمة blank ذهبت. lida tea / poured هي الصفحة السابقة.

عند المنضدة

  1. اجعل الكوب waiting، ونادِ pour("lida")، وسجّل الكوب فورًا. السجل waiting.
  2. ضع المشروب على الكوب داخل then. ذلك السجل lida tea.
  3. نادِ pour("") والتقط السبب بـ catch. السجل no leaves.
  4. اقرأ typeof order.then. السجل function.
  5. اقرأ سطر الصفحة: waiting / lida tea.

أخطاء عند المنضدة

الكوب يقول waiting حتى يجري then. لا يقول poured.

  • توقع أن السجل تحت pour هو lida tea
  • معاملة القيمة المُرجعة كأنها نص المشروب
  • استخدام then لطلب فارغ وتفويت no leaves
  • استخدام catch لـ lida وتوقع no leaves
  • قراءة السطر كـ lida tea / poured

احتفظ بهذا

  • pour تُرجع وعدًا، لا النص lida tea
  • السطر التالي ما زال يسجّل waiting
  • then يستلم lida tea بعد هذا السكربت
  • الطلب الفارغ يُرفض بـ no leaves، وcatch يسجّله
  • سطر الصفحة waiting / lida tea

🧠 اختبر معرفتك

جاهز للبدء

اختبر معرفتك

تحدى نفسك مع هذا الاختبار التفاعلي واكتشف مدى فهمك للموضوع

❓
5
الأسئلة
🎯
70%
للنجاح
♾️
∞
الوقت
🔄
∞
المحاولات

📝 التعليمات

  • اقرأ كل سؤال بعناية
  • اختر أفضل إجابة لكل سؤال
  • يمكنك إعادة الاختبار عدة مرات كما تريد
  • سيتم عرض تقدمك في الأعلى
الموضوع 58 من 60
Javascript درس تعليمي