كل برنامج مفيد يصل في نهاية المطاف إلى نقطة اتخاذ قرار. هل يجب أن يقوم هذا الزر بإرسال النموذج أم إظهار خطأ؟ هل هذا الم...

كل برنامج مفيد يصل في النهاية إلى نقطة اتخاذ قرار. هل يجب أن يقوم هذا الزر بإرسال النموذج أم إظهار خطأ؟ هل يرى هذا المستخدم لوحة تحكم المسؤول أم عرض الضيف؟ تجيب JavaScript على هذه الأسئلة باستخدام الجمل الشرطية. إنها بمثابة صمامات التحكم في الكود الخاص بك: تفتح مساراً وتغلق آخر، وكل ذلك بناءً على ما إذا كان التعبير يؤول إلى true أو false. بدونها، سيتحرك النص البرمجي الخاص بك من الأعلى إلى الأسفل دون أي تفاعل مع الشخص الذي يستخدمه.

الفرع الأبسط: if

جملة if هي البوابة التي تعبرها أولاً. تضع شرطاً داخل أقواس. إذا أدى هذا الشرط إلى true يتم تنفيذ كتلة الكود الموجودة أسفله. أما إذا أدى إلى false فإن JavaScript تتخطى الكتلة تماماً وتستمر في الملف.

هذا هو بالضبط ما تحتاجه لإجراء عمليات تحقق بسيطة لمرة واحدة. تخيل التحقق من حقل نموذج قبل إرسال أي شيء إلى الخادم:

const email = document.getElementById("email").value;

if (email === "") {
  alert("Please enter your email.");
}

بدون email لا يوجد إرسال. المنطق مباشر وواضح. استخدم if عندما تكون هناك حالة خاصة واحدة فقط يجب الحماية منها ولا يتطلب الأمر إجراءً بديلاً.

التعامل مع الخيارين: if...else

معظم القرارات الحقيقية لها جانبان. زوج if...else يغطي ذلك تماماً. يتم تنفيذ كتلة واحدة عندما يكون الشرط صحيحاً، وتُنفذ الكتلة الأخرى عندما يكون خاطئاً. المساران متنافيان.

تخيل التحقق من الوضع الليلي (dark-mode) عند تحميل الصفحة:

const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;

if (prefersDark) {
  document.body.classList.add("dark");
} else {
  document.body.classList.add("light");
}

لن يقوم المتصفح أبداً بإضافة كلا الفئتين (classes). سيختار مساراً واحداً، ينفذه، ثم يمضي قدماً. كلما انقسم منطقك بوضوح إلى نتيجتين محتملتين، فهذا هو الهيكل الذي يجب أن تلجأ إليه.

مسارات متعددة: if...else if...else

ليست كل المشكلات ثنائية. أحياناً تحتاج إلى سلم من الاحتمالات. تتيح لك سلسلة if...else if...else اختبار عدة شروط بالتتابع. تقوم JavaScript بتقييمها من الأعلى إلى الأسفل وتنفذ أول كتلة يكون شرطها صحيحاً. بعد هذا التطابق، يتم تجاهل بقية السلم.

مثال كلاسيكي هو ربط درجة رقمية بتقدير حرفي:

const score = 87;
let grade;

if (score >= 90) {
  grade = "A";
} else if (score >= 80) {
  grade = "B";
} else if (score >= 70) {
  grade = "C";
} else {
  grade = "F";
}

الترتيب مهم للغاية هنا. إذا قمت بالتحقق من score >= 70 قبل score >= 90 فستقع معظم درجات النجاح في فئة C لأن أول تطابق صحيح هو الذي يفوز. حافظ على ترتيب شروطك من الأكثر تحديداً إلى الأقل تحديداً، واختم السلسلة دائماً بـ else نهائية لالتقاط أي شيء قد يفلت.

مطابقة القيم الثابتة: switch

عندما تقوم بمقارنة متغير واحد بقائمة من الثوابت المعروفة، فإن سلسلة if...else الطويلة تصبح مشتتة وصاخبة. جملة switch تنظم الأمور. فهي تقيم تعبيراً واحداً، ثم تقارنه بتسميات case باستخدام المساواة الصارمة (===). وهذا يجعل الكود أسهل في القراءة عندما تكون الخيارات منفصلة ومسماة.

فكر في ضبط ساعات العمل في المتجر بناءً على اليوم الحالي:

const day = new Date().getDay();

switch (day) {
  case 0:
    console.log("Sunday hours: 10am - 4pm");
    break;
  case 6:
    console.log("Saturday hours: 9am - 6pm");
    break;
  default:
    console.log("Weekday hours: 8am - 8pm");
}

كن حذراً مع break. إذا أغفلته، سينتقل التنفيذ إلى الـ case التالي ويستمر في العمل. هذا السلوك مفيد أحياناً، ولكنه في أغلب الأحيان يسبب أخطاءً صامتة. عند استخدام switch بشكل صحيح، فإنها تجعل نيتك واضحة من نظرة واحدة وتحافظ على توازي الفروع ذات الصلة في عمود واحد مرتب.

القرارات المختصرة: العامل الثلاثي (Ternary Operator)

العامل الثلاثي — الذي يُكتب بصيغة ? : — هو تعبير (expression) وليس جملة (statement). هذا التمييز مهم