الوحدة 2 · المنطق والدوال
اتخاذ القرارات: if وelse والقيم الـ truthy
17 دقراءة 4 دبيئة تجريب الكود
الدرس في لمحة
تجعل برنامجك يختار بين مسارات مختلفة باستخدام if وelse if وelse، وتجمع الشروط بـ && و|| و!، وتختار القيم بالعامل الثلاثي، وتتوقّع أيّ القيم تُعدّ truthy وأيّها falsy.
- 1if وelse if وelse
- 2الجمع بين الشروط
- 3قيمة واحدة وخيارات ثابتة كثيرة: switch
- 4العامل الثلاثي: اختيار قيمة
- 5القيم الـ truthy والـ falsy
لا فيديو هنا، بل الشيء الحقيقي: درس مكتوب وأمثلة قابلة للتشغيل واختبار وتدريب.
يستطيع Pocket أن يجمع ما أنفقته. والآن عليه أن يخبرك كيف حالك: بخير، أو تقترب من ميزانيتك، أو تجاوزتها. وهذا يعني تنفيذ كود مختلف بحسب البيانات، وهذا ما وُجدت الشروط من أجله.
if وelse if وelse
تعليمة if تنفّذ كتلة من الكود فقط حين يكون شرطها صحيحًا:
const budgetCents = 2000;
const spentCents = 1750;
if (spentCents > budgetCents) {
console.log("Over budget");
} else if (spentCents >= budgetCents * 0.8) {
console.log("Close to your budget");
} else {
console.log("On track");
}يحسب المحرّك الشرط الأول، 1750 > 2000، فيحصل على false، وينتقل إلى ما بعده. الشرط الثاني، 1750 >= 1600، صحيح (true)، فتُنفَّذ كتلته، ويُتخطّى باقي السلسلة. أما كتلة else فلا تُنفَّذ إلا حين تكون كل الشروط التي فوقها خاطئة. ولا تُنفَّذ أبدًا أكثر من كتلة واحدة في السلسلة.
لأن أول شرط صحيح هو الذي يفوز، فإن الترتيب مهم. ضع الحالة الأضيق أولًا. لو فحصت “80% على الأقل” قبل “تجاوز الميزانية”، فإن الشهر الذي تجاوز الميزانية سيكون أيضًا 80% على الأقل، ولن ترى رسالة “Over budget” أبدًا. وفي الاختبار أدناه سؤال فيه هذا الخطأ بالضبط.
الأقواس المعقوفة تحدّد كتلة (block)، أي مجموعة من التعليمات تُنفَّذ معًا. إن كان جسم الشرط سطرًا واحدًا فالأقواس اختيارية من الناحية التقنية، لكن اكتبها دائمًا: إضافة سطر ثانٍ لاحقًا دون أقواس خطأ كلاسيكي يجعل السطر الأول وحده هو المشروط.
الجمع بين الشروط
ثلاثة عوامل منطقية تتيح لك بناء شروط أكبر:
a && b(و) صحيحة فقط حين يكون الطرفان صحيحين.a || b(أو) صحيحة حين يكون أحد الطرفين على الأقل صحيحًا.!a(ليس) تقلب الصحيح إلى خاطئ والعكس.
const amountCents = 12500;
const category = "travel";
const isWeekend = false;
if (amountCents > 10000 && category !== "rent") {
console.log("Big purchase: ask yourself twice");
}
if (category === "food" || category === "travel") {
console.log("Flexible spending");
}
if (!isWeekend) {
console.log("Weekday");
}تُحسب && قبل ||، تمامًا كما يُحسب * قبل +. وحين تخلط بينهما، أضف أقواسًا كي لا يضطر أحد، بما في ذلك أنت في المستقبل، إلى تذكّر هذه القاعدة.
قيمة واحدة وخيارات ثابتة كثيرة: switch
حين تقارن قيمة واحدة بقائمة من الخيارات المحدّدة، مثل الفئة، تصبح سلسلة else if (category === …) مكرّرة ومملّة. وتعليمة switch مصمّمة لهذه الحالة بالذات:
const category = "travel";
let monthlyLimit;
switch (category) {
case "food":
monthlyLimit = 40000;
break;
case "travel":
case "fun":
monthlyLimit = 15000;
break;
default:
monthlyLimit = 10000;
}
console.log(monthlyLimit);تقارن switch باستخدام ===، وتقفز إلى أول case مطابقة، وتنفّذ من هناك حتى تصل إلى break. انسَ break فيستمر التنفيذ “منزلقًا” (fall through) إلى الحالة التالية، وهذا خطأ متكرّر. وأحيانًا يكون مقصودًا، كما في اشتراك "travel" و"fun" في سقف واحد أعلاه. أما default فتُنفَّذ حين لا يطابق شيء، مثل else الأخيرة. ومع شرطين أو ثلاثة، أو مع أي شيء ليس فحص مساواة بسيطًا، ابقَ مع if.
العامل الثلاثي: اختيار قيمة
كثيرًا ما لا تريد أن تفعل أشياء مختلفة، بل أن تختار بين قيمتين. والعامل الشرطي، الذي يُسمّى عادةً العامل الثلاثي (ternary)، يفعل ذلك في تعبير واحد:
const spent = 2100;
const budget = 2000;
const status = spent > budget ? "Over budget" : "On track";
console.log(status);اقرأه هكذا: “إن كان spent > budget فالقيمة "Over budget"، وإلا فالقيمة "On track"”. ولأن العامل الثلاثي يُنتج قيمة، يمكنك تخزينها في const أو إسقاطها داخل template literal. استخدمه حين تكون هناك نتيجتان. ومع ثلاث نتائج أو أكثر، تُقرأ سلسلة if أفضل من العوامل الثلاثية المتداخلة.
القيم الـ truthy والـ falsy
لا يُشترط أن يكون الشرط قيمة منطقية. تقبل JavaScript أي قيمة وتحوّلها: القيم التي تُعامَل على أنها صحيحة تُسمّى truthy، والتي تُعامَل على أنها خاطئة تُسمّى falsy. وقائمة الـ falsy قصيرة بما يكفي لتحفظها:
false، 0، -0، 0n، "" (نص فارغ)، null، undefined، NaN.
وكل ما عداها truthy، بما في ذلك قيم تفاجئ الناس: "0" و"false" و" " (مسافة)، والقوائم والكائنات الفارغة.
const note = "";
if (note) {
console.log("Has a note");
} else {
console.log("No note");
}
console.log(Boolean("0"), Boolean(0), Boolean(" "));هذه الخاصية تجعل فحوصًا مثل if (note) قصيرة ومقروءة مع النصوص، حيث “فارغ” و"غير موجود" يعنيان كلاهما “لا شيء لعرضه”. لكنها خطرة مع الأرقام، حيث يكون الصفر غالبًا قيمة حقيقية وصالحة.
تعمل && و|| أيضًا مع القيم غير المنطقية: فهما تُرجعان أحد طرفيهما. التعبير name || "Anonymous" يعطي name إن كانت truthy، و"Anonymous" فيما عدا ذلك، وهذه طريقة شائعة لتوفير قيم افتراضية. لكن فيها مشكلة الصفر نفسها، ولهذا أضافت JavaScript عاملًا أفضل للقيم الافتراضية، هو ??، وستتعرّف عليه في القسم 3.
الشروط تتيح لـ Pocket أن يتفاعل مع قيمة واحدة. وفي الدرس التالي ستجعله يتعامل مع قيم كثيرة، واحدة تلو الأخرى، باستخدام حلقات التكرار.
أهم النقاط
- سلسلة
ifتفحص الشروط من الأعلى إلى الأسفل ولا تنفّذ إلا أول كتلة شرطها صحيح، لذلك ضع الحالة الأضيق أولًا. &&تحتاج أن يكون الطرفان صحيحين، و||تحتاج طرفًا صحيحًا واحدًا على الأقل، و!تقلب القيمة المنطقية.- استخدم العامل الثلاثي
condition ? a : bللاختيار بين قيمتين، وifللاختيار بين فعلين. - ثماني قيم فقط هي falsy (
falseو0و-0و0nو""وnullوundefinedوNaN)؛ وكل ما عداها truthy، بما في ذلك"0"و[].