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

الشرط if و else

المعاملات المنطقية أعطتك جواب نعم/لا. السؤال التالي: أي أسطر يجب أن تعمل؟ إن كان الجواب نعم شغّل كتلة، وإن كان لا شغّل كتلة أخرى. هذا الاختيار هو if / else / else if. تعرف كيف تبني boolean؛ هنا تستخدمه لاختيار المسار.

ماذا يفعل if؟

ينظر if إلى الشرط بين القوسين. إن كانت القيمة truthy ينفّذ JavaScript الكتلة داخل الأقواس المعقوفة بعدها مباشرة. إن كانت falsy تُتخطى تلك الكتلة. else هو المسار الاحتياطي حين يفشل if. وelse if يضيف فحصاً آخر قبل else النهائي.

نظرة سريعة على الكلمات المفتاحية

📊 قطع if / else اليومية

الكلمة القراءة اليومية الاستخدام المعتاد
if إن مرّ هذا، نفّذ هذه الكتلة الفحص الأول
else if وإلا، إن مرّ هذا الفحص الآخر… المسارات الوسطى
else وإلا نفّذ هذا المسار الأخير

أبقِ الشرط صادقاً: مقارنة (age >= 18)، أو ربط منطقي (age >= 18 && score >= 60)، أو متغير boolean واضح. ثم ضع عمل ذلك المسار داخل { … }.

if بسيط

javascript 
let age = 20;
if (age >= 18) {
console.log("adult");
}
console.log("done");

if يعمل فقط حين يمرّ الفحص

هنا age يساوي 20، فـage >= 18 يصبح true وتطبع وحدة التحكم adult ثم done. غيّر age إلى 16 فيبقى done فقط — تُتخطى كتلة if.

السطر بعد } المغلق يعمل عادة دائماً (ما لم تخرج لاحقاً من الدالة). if لا يوقف البرنامج كله؛ يقرر فقط إن كانت كتلته تعمل.

if مع else

javascript 
let age = 16;
if (age >= 18) {
console.log("adult");
} else {
console.log("under 18");
}

else يغطي المسار الآخر

الآن يفشل الفحص، فيتخطى JavaScript الكتلة الأولى وينفّذ else. ترى under 18. في زوج if / else البسيط يعمل مسار واحد بالضبط — لا الاثنان معاً ولا ولا واحد.

سلسلة else if

javascript 
let score = 75;
if (score >= 90) {
console.log("A");
} else if (score >= 60) {
console.log("pass");
} else {
console.log("retry");
}

else if يضيف مسارات وسطى

score يساوي 75. يفشل الفحص الأول (>= 90). يمرّ الثاني (>= 60) فترى pass ويُتخطى else الأخير. الترتيب مهم: ضع الشروط الأشد أولاً حين تتداخل النطاقات.

لو كتبت ثلاثة if منفصلة قد تعمل أكثر من كتلة. else if يبقي المسارات حصرية — بعد أول تطابق تتوقف السلسلة.

شرط من مقارنة ومنطق

javascript 
let age = 20;
let score = 75;
if (age >= 18 && score >= 60) {
console.log("allowed");
} else {
console.log("blocked");
}
let ready = false;
if (!ready) {
console.log("wait");
}

ضع فحوصاً حقيقية داخل الأقواس

قد يكون الشرط مقارنة أو تعبيراً منطقياً أو boolean مقلوباً. age >= 18 && score >= 60 يساوي true فترى allowed. و!ready أيضاً true فترى wait. ابنِ نعم/لا أولاً؛ ثم دع if يختار الفرع.

حفظ رسالة الفرع

javascript 
let age = 20;
let label;
if (age >= 18) {
label = "adult";
} else {
label = "under 18";
}
console.log(label);

سمِّ نتيجة الفرع

أحياناً تريد نصاً (أو رقماً) من الاختيار لا مجرد console.log. عيّن label داخل كل فرع ثم استخدمه مرة بعدها. هنا يصبح label هو "adult".

اعرض المسار المختار في الصفحة

اصنع رسالة قصيرة بـif / else ثم اكتبها في الصفحة.

فرع الصفحة مع if else

html 
<!DOCTYPE html>
<html>
<head>
<title>If else — page branch</title>
</head>
<body>
<p id="out">…</p>
<script>
let age = 20;
let msg;
if (age >= 18) {
msg = "adult";
} else {
msg = "under 18";
}
let box = document.getElementById("out");
box.textContent = "status=" + msg;
</script>
</body>
</html>

age يساوي 20 فتظهر الصفحة status=adult. اجعل age يساوي 16 وحدّث الصفحة لترى status=under 18. الدرس التالي (switch) طريقة أخرى للاختيار بين قيم ثابتة كثيرة؛ أما بوابة نعم/لا اليومية فتبقى أدواتها if / else.

جرّب بنفسك

  1. سجّل "ok" داخل if (true) وتأكد أنه يُطبع.
  2. استخدم if / else مع let age = 16 واطبع "adult" أو "under 18".
  3. ابنِ سلسلة else if لنطاقات score: A (≥ 90)، pass (≥ 60)، وإلا retry.
  4. اجمع age >= 18 && score >= 60 في شرط if واحد.
  5. خزّن نص label من if / else ثم سجّله مرة.
  6. في عرض HTML غيّر age فقط، حدّث الصفحة، واقرأ نص status= الجديد.

أخطاء شائعة

  • نسيان الأقواس المعقوفة { } حول جسم الفرع
  • كتابة if (age = 18) بـ= واحد (تعيين) بدل المقارنة
  • وضع else بلا if مطابق فوقه
  • عدة if منفصلة حين قصدت مسارات else if حصرية
  • فحص النطاقات بترتيب خاطئ (مثل >= 60 قبل >= 90)

خلاصة

  • if ينفّذ كتلة حين يكون الشرط truthy
  • else يعمل حين فشل ذلك if
  • else if يضيف مسارات وسطى حصرية
  • الشروط عادة مقارنات أو تعبيرات منطقية
  • أبقِ كل فرع داخل أقواس؛ خزّن التسمية إن احتجت النتيجة لاحقاً
  • التالي: أمر switch — الاختيار بين عدة قيم ثابتة

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

جاهز للبدء

اختبر معرفتك

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

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

📝 التعليمات

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