الجمل الشرطية if/else في جافاسكريبت: شرح شامل ومفصل

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

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

مفهوم الجمل الشرطية في جافاسكريبت

الجمل الشرطية عبارة عن بناء برمجي يسمح بتقييم تعبير منطقي (شرط) لتحديد ما إذا كانت النتيجة صحيحة (true) أو خاطئة (false). بناءً على نتيجة هذا التقييم، يتم تنفيذ كود معين أو تجاهله. هذا يتيح للبرنامج اتخاذ مسارات تنفيذ مختلفة بدلاً من السير في خط واحد.

أهميتها في البرمجة

في البرمجة، لا يمكن لأي تطبيق أن يكون مفيدًا بدون اتخاذ قرارات؛ فمثلاً عند التحقق من بيانات المستخدم، أو عند اختيار عمليات مختلفة حسب مدخلات معينة، أو في حالات التكرار مع حالات توقف محددة، تعد الجمل الشرطية هي الأداة الأساسية التي تسمح بهذا التمييز بين السيناريوهات.

بناء الجملة الأساسية if في جافاسكريبت

البنية الأساسية للجملة الشرطية if في جافاسكريبت بسيطة وواضحة، وتتمثل في التالي:

javascript
CopyEdit
if (الشرط) {
  // تنفيذ هذا الكود إذا تحقق الشرط
}

• الشرط: هو تعبير منطقي يتم تقييمه إلى true أو false.

• الكود داخل الأقواس المعقوفة: يتم تنفيذه فقط إذا كان الشرط صحيحًا.

مثال توضيحي

javascript
CopyEdit
let age = 20;

if (age >= 18) {
  console.log("يمكنك التصويت.");
}

في هذا المثال، إذا كانت قيمة age أكبر من أو تساوي 18، يتم تنفيذ جملة console.log التي تطبع رسالة تفيد بأن المستخدم يمكنه التصويت.

استخدام else مع if

في بعض الحالات، لا يقتصر الأمر على تنفيذ كود في حال تحقق الشرط فقط، بل يمكن أيضًا تنفيذ كود بديل في حالة عدم تحقق الشرط. هنا يأتي دور جملة else.

javascript
CopyEdit
if (الشرط) {
  // تنفيذ إذا تحقق الشرط
} else {
  // تنفيذ إذا لم يتحقق الشرط
}

مثال توضيحي

javascript
CopyEdit
let age = 16;

if (age >= 18) {
  console.log("يمكنك التصويت.");
} else {
  console.log("عذرًا، أنت صغير السن ولا يمكنك التصويت.");
}

في هذا المثال، إذا لم يتحقق الشرط (أي كانت age أقل من 18)، يتم تنفيذ الكود الموجود داخل else.

استخدام else if لتعدد الشروط

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

javascript
CopyEdit
if (الشرط1) {
  // تنفيذ إذا تحقق الشرط1
} else if (الشرط2) {
  // تنفيذ إذا تحقق الشرط2
} else {
  // تنفيذ إذا لم يتحقق أي من الشروط السابقة
}

مثال توضيحي

javascript
CopyEdit
let score = 75;

if (score >= 90) {
  console.log("امتياز");
} else if (score >= 75) {
  console.log("جيد جدًا");
} else if (score >= 60) {
  console.log("جيد");
} else {
  console.log("راسب");
}

يتم هنا التحقق من الدرجات حسب الشرط المناسب، ويُطبع التقييم المناسب حسب النتيجة.

تفاصيل تقنية حول تقييم الشروط

التقييم المنطقي للشرط

يتم تقييم شرط جملة if عبر تحويل التعبير الموجود بين القوسين إلى قيمة بوليانية (true أو false). في جافاسكريبت، توجد قواعد خاصة تتحكم في كيفية تحويل أنواع البيانات غير البولينية إلى قيمة منطقية:

• القيم التي تُعتبر false في السياق المنطقي تسمى “Falsy values”، وتشمل:
  
  false

0

"" (سلسلة فارغة)
  
  null

undefined

NaN

• أي قيمة أخرى تعتبر “Truthy”، أي تتحول إلى true في التقييم الشرطي.

مثال على ذلك

javascript
CopyEdit
let input = "";

if (input) {
  console.log("يوجد مدخلات.");
} else {
  console.log("المدخلات فارغة.");
}

نظرًا لأن السلسلة النصية الفارغة "" تعتبر falsy، فإن الجملة داخل else سيتم تنفيذها.

تنويعات أخرى على الجمل الشرطية if/else في جافاسكريبت

استخدام جملة if بدون أقواس مع تنفيذ تعبير واحد فقط

جافاسكريبت تسمح بإزالة الأقواس المعقوفة {} إذا كان هناك تعبير واحد فقط بعد شرط if أو else:

javascript
CopyEdit
if (condition) 
  console.log("الشرط تحقق");
else 
  console.log("الشرط لم يتحقق");

رغم ذلك، من الأفضل استخدام الأقواس دائمًا للحفاظ على وضوح الكود وتجنب الأخطاء عند الإضافة أو التعديل.

الجمل الشرطية المتداخلة (Nested if)

يمكن وضع جملة if داخل أخرى لتحقيق شروط أكثر تعقيدًا:

javascript
CopyEdit
if (age >= 18) {
  if (hasVoterID) {
    console.log("يمكنك التصويت.");
  } else {
    console.log("يجب أن تمتلك بطاقة انتخابية.");
  }
} else {
  console.log("أنت صغير السن ولا يمكنك التصويت.");
}

يتيح هذا النموذج التحكم الدقيق في الحالات المعقدة.

مقارنة if/else مع الجملة الشرطية الثلاثية (Ternary Operator)

بالإضافة إلى if/else التقليدية، تقدم جافاسكريبت مشغلًا شرطياً مختصرًا يعرف بالمشغل الثلاثي، يتيح كتابة شرط بسيط في سطر واحد:

javascript
CopyEdit
condition ? exprIfTrue : exprIfFalse;

مثال

javascript
CopyEdit
let age = 20;
let message = age >= 18 ? "يمكنك التصويت." : "عذرًا، لا يمكنك التصويت.";
console.log(message);

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

استخدام if/else مع القيم المنطقية والمعقدة

يمكن أيضًا استخدام الجمل الشرطية للتحقق من قيم أو تعبيرات من أنواع مختلفة:

• التحقق من وجود قيمة أو عدم وجودها:

javascript
CopyEdit
if (userName) {
  console.log("مرحبًا، " + userName);
} else {
  console.log("مرحبًا، زائر");
}

• التحقق من تطابق قيمة نصية أو رقمية:

javascript
CopyEdit
if (color === "red") {
  console.log("اللون أحمر.");
}

الجمل الشرطية وسير التنفيذ (Control Flow)

في جافاسكريبت، تدفق البرنامج يتأثر بشكل مباشر بنتائج الجمل الشرطية، مما يسمح ببناء منطق برمجي متفرع حسب الحاجة. مع دمج الجمل الشرطية في حلقات التكرار أو الدوال، يصبح بالإمكان تصميم حلول برمجية معقدة وفعالة.

أفضل الممارسات عند استخدام if/else في جافاسكريبت

• الوضوح أولاً: من المهم كتابة الشروط بطريقة واضحة وسهلة الفهم، تجنب الشروط المعقدة جداً في جملة واحدة، ويفضل تقسيمها.

• استخدام الأقواس دائمًا: حتى لو كان تنفيذ تعبير واحد فقط، للحفاظ على قابلية القراءة وتقليل الأخطاء.

• الترتيب المنطقي للشروط: رتب الشروط بدءًا من الأكثر احتمالًا للتحقق لتقليل الزمن المستغرق في التقييم.

• الاستفادة من المشغل الثلاثي للحالات البسيطة: عند الحاجة لكتابة شرط واحد بسيط، استخدم ? : لتقليل التعقيد.

• التجنب من التداخل العميق للجمل الشرطية: في حال زيادة التعقيد، من الأفضل إعادة التفكير في هيكلة الكود أو تقسيمه إلى دوال أصغر.

أمثلة تطبيقية متقدمة لاستخدام if/else

مثال 1: التحقق من حالة الطقس وتقديم توصيات

javascript
CopyEdit
let temperature = 25;
let weather = "ممطر";

if (weather === "ممطر") {
  console.log("احمل مظلة معك.");
} else if (temperature >= 30) {
  console.log("ارتدِ ملابس خفيفة.");
} else if (temperature <= 10) {
  console.log("ارتدِ ملابس دافئة.");
} else {
  console.log("الطقس معتدل.");
}

مثال 2: معالجة صلاحيات المستخدم

javascript
CopyEdit
let userRole = "admin";

if (userRole === "admin") {
  console.log("لديك صلاحيات المدير.");
} else if (userRole === "editor") {
  console.log("لديك صلاحيات المحرر.");
} else if (userRole === "viewer") {
  console.log("لديك صلاحيات المشاهد فقط.");
} else {
  console.log("صلاحية غير معروفة.");
}

الجدول التالي يوضح مقارنة بين أنواع القيم المنطقية المستخدمة في الشروط وكيفية تفسيرها في if/else:

خلاصة تفصيلية حول الجمل الشرطية if/else في جافاسكريبت

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

المصادر والمراجع

• MDN Web Docs: if…else

• كتاب “You Don’t Know JS” (Kyle Simpson) – قسم التحكم في التدفق البرمجي

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