في هذا الدرس 5تصفّح المواضيع
لاحظت في الدرس السابق أن جملة if / else تعليمة تحكم لا تنتج قيمة بذاتها؛ فكنا نضطر لتعريف متغير قابل للتعديل let label = "" أولاً ثم إسناد القيمة داخلياً.
هنا يبرز جمال المعامل الشرطي الثلاثي (Ternary Operator) ? :؛ فهو المعامل الوحيد في JavaScript الذي يأخذ ثلاثة أطراف ويعمل كتعبير ينتج قيمة جاهزة فوراً يمكنك حفظها مباشرةً في ثابت const أو تضمينها داخل قالب نصي!
تتكون الصياغة من ثلاثة أركان مرتبة بدقة: condition ? valueIfTrue : valueIfFalse. ويتميز المعامل الثلاثي بـالتقييم الكسول الذكي؛ فهو يحسب وينفذ الطرف الفائز فقط ويتجاهل حساب الطرف الآخر تماماً!
يتألق المعامل الثلاثي في نمطين يوميين بواجهات الويب: تهيئة ثابت const بقيمة شرطية في سطر واحد نظيف مثل const fee = isMember ? 0 : 15;، وتبديل صيغ المفرد والجمع أو شارات الحالة مباشرةً داخل القوالب النصية.
const isAnnual = true;
const itemsCount = 1;
const rate = isAnnual ? 8 : 12;
const noun = itemsCount === 1 ? 'seat' : 'seats';
document.getElementById('trn-out').textContent =
`${itemsCount} ${noun} @ ${rate} USD/mo`;ليس الهدف من المعامل الثلاثي إلغاء جملة if، بل لكل أداة موضعها الهندسي الصحيح:
| الحالة البرمجية | الأداة المثلى | السبب الهندسي |
|---|---|---|
| اختيار إحدى قيمتين لإسنادها لثابت أو عرضها | المعامل الثلاثي ? : | يسمح باستخدام const مباشرةً في تعبير واحد أنيق |
| تنفيذ عدة أوامر وخطوات متتالية بالفرع الواحد | جملة if / else | الأوامر المتعددة مكانها الطبيعي داخل أقواس الكتل { ... } |
| تشغيل إجراء عند التحقق فقط بلا مسار بديل | جملة if مفردة | المعامل الثلاثي يجبرك على كتابة طرف بديل غير مستخدم |
إن حشر معاملات ثلاثية متداخلة في سطر واحد مثل a ? b : c ? d : e قد يختصر سطرين لكنه يرهق عين القارئ ويجعل تتبع الأخطاء مهمة شاقة!
احصر استخدام المعامل الثلاثي دائماً في الاختيار الثنائي البسيط (علامة ? واحدة ونقطتان : واحدة)؛ ومتى تعددت الحالات إلى ثلاثة مسارات أو أكثر، انتقل فوراً إلى سلاسل if / else if الواضحة.
const stock = 4;
const badgeText = stock > 0 ? `${stock} left in stock` : 'Out of stock';
const badgeTone = stock > 0 ? 'Available' : 'Waitlist';
document.getElementById('stk-out').textContent =
`[${badgeTone}] ${badgeText}`;ملخص الدرس
حصاد الدرسمراجعة مركّزة لأهم المفاهيم والقواعد الهندسية التي أتقنتها في هذا الدرس قبل التطبيق العملي
ماذا تعلّمت في هذا الدرس؟
أتقنت في هذا الدرس طبيعة المعامل الشرطي الثلاثي ? : كتعبير منتج للقيمة، وأركانه الثلاثة الإلزامية وأولويته مع الجمع، ومتى يُفضل على if / else، وسبب تجنب السلاسل الثلاثية المتداخلة. الخطوة التالية: انتقل الآن إلى درس «جملة الاختيار في JavaScript» لمطابقة قيمة واحدة بعدة خيارات محددة بتنظيم أنيق!
سجّل الدخول لحفظ تقدمك
تابع إنجاز المواضيع والمصطلحات والمهام، وكمّل من آخر خطوة على أي جهاز.
المصطلحات3
راجع المعنى، اشرحه لنفسك، ثم علّم البطاقة كمفهومة.
- 01 Ternary Operator (? :) المعامل الشرطي الثلاثي (? :)
- التعبير الشرطي ذو الأطراف الثلاثة في JavaScript لإرجاع إحدى قيمتين بناءً على تحقق الشرط.
- للمراجعة
- 02 Expression vs Statement الفرق بين التعبير والجملة
- ينتج التعبير قيمة قابلة للإسناد المباشر، بينما توجه الجملة سير التنفيذ دون إرجاع قيمة.
- للمراجعة
- 03 Lazy Branch Evaluation التقييم الكسول للفرع الفائز
- حساب وتنفيذ الطرف المختار فقط وتجاهل الطرف الآخر غير المختار بالكامل.
- للمراجعة
لا توجد بطاقات تطابق البحث والتصفية.
اقرأ البطاقات بحرية. سجّل الدخول لحفظ تقدم مراجعتك.
الاختصارات2
راجع المعنى، اشرحه لنفسك، ثم علّم البطاقة كمفهومة.
- 01 DRY DRY
- Do Not Repeat Yourself
- مبدأ عدم تكرار الكود، ويتحقق بتغيير الكلمة المتبدلة فقط بالمعامل الثلاثي بدل تكرار الجملة كلها.
- للمراجعة
- 02 UI UI
- User Interface
- واجهة المستخدم التي تُحسب فيها صيغ المفرد والجمع وألوان السمات غالباً بالمعامل الثلاثي.
- للمراجعة
لا توجد بطاقات تطابق البحث والتصفية.
اقرأ البطاقات بحرية. سجّل الدخول لحفظ تقدم مراجعتك.
مهامك قبل الاختبار
خطوة صغيرة كل مرة. وإنجاز تقدر ترجع له.
-
افتح مثال التسعير في محرر التجربة وغيّر قيمة itemsCount من 1 إلى 5 لملاحظة تحول الكلمة تلقائياً لصيغة الجمع.
-
افحص التبويب الثاني في المحاكي لمشاهدة دور الأقواس في حماية المعامل الثلاثي عند استخدامه مع +.
تأشير المهمة إقرار منك بإتمامها، وليس تصحيحًا آليًا للكود. يُحفظ تقدمك في حسابك.
اختبر فهمك.
ووصلها للإتقان.
كل سؤال خطوة لقدّام. اختار، اكتب كود، وشوف نتيجتك فورًا.
أكمل المهام، واجمع كل الإجابات الصحيحة. أقل من 100%؟ راجع وأعد المحاولة.
الأسئلة متاحة للاطلاع. سجّل الدخول للتفاعل وحفظ تقدمك.