JavaScript/Conditional Operator

المعامل الشرطي (conditional operator) هو المعامل الوحيد في JavaScript الذي يأخذ ثلاثة قيمة ليجري عليها عمليته، ومن الشائع استخدام هذا المعامل كاختصارٍ للتعبير البرمجي if.

البنية العامة

condition ? expr1 : expr2

condition

تعبير برمجي نتيجته هي true أو false.

expr1 و expr2

تعبيرين برمجيين من أيّ نوع.

الوصف

إذا كان الشرط condition محققًا true فسيُعيد المعامل قيمة التعبير expr1، وفيما عدا ذلك سيُعيد قيمة التعبير expr2؛ فمثلًا لو أردنَا عرض رسالة مختلفة اعتمادًا على قيمة المتغير isMember فسنستخدم التعبير البرمجي الآتي:

'The fee is ' + (isMember ? '$2.00' : '$10.00');

يمكنك أيضًا إسناد قيمة إلى المتغيرات اعتمادًا على نتيجة المعامل الثلاثي الشرطي:

var elvisLives = Math.PI > 4 ? 'Yep' : 'Nope';

لاحظ أنَّ بالإمكان استخدام أكثر من معامل شرطي معًا:

var firstCheck = false,
    secondCheck = false,
    access = firstCheck ? 'Access denied' : secondCheck ? 'Access denied' : 'Access granted';
  
console.log(access); // "Access granted"

يمكن أيضًا استخدام أكثر من معامل شرطي كما نستخدم أكثر من تعبير if متشعب:

var condition1 = true,
    condition2 = false,
    access = condition1 ? (condition2 ? "true true": "true false") : (condition2 ? "false true" : "false false");

console.log(access); // "true false"

لاحظ أنَّ الأقواس غير ضرورية، ولن تؤثر على وظيفة المعامل، لكنها تساعدنا في تسهيل فهم المعامل. يمكنك أيضًا استخدام المعامل الثلاثي دون إسناد قيمته إلى متغير لإجراء عمليات اعتمادًا على قيمة أحد التعابير:

var stop = false, age = 16;

age > 18 ? location.assign('continue.html') : stop = true;

يمكنك أيضًا إجراء أكثر من عملية واحدة في كل حالة، بفصلها بفاصلة , وبوضعها ضمن قوسين:

var stop = false, age = 23;

age > 18 ? (
    alert('OK, you can go.'),
    location.assign('continue.html')
) : (
    stop = true,
    alert('Sorry, you are much too young!')
);

يمكنك أيضًا إجراء أكثر من عملية عند إسناد ناتج هذا المعامل إلى متغير، وستُستخدَم آخر قيمة يسبقها معامل الفاصلة ضمن القوسين:

var age = 16;

var url = age > 18 ? (
    alert('OK, you can go.'), 
    'continue.html' // القيمة التي ستُسنَد إذا كان العمر أكبر من 18
) : (
    alert('You are much too young!'),
    alert('Sorry :-('),
    'stop.html' // القيمة التي ستُسنَد إذا كان العمر ليس أكبر من 18
);

location.assign(url); // "stop.html"

إعادة قيمة المعامل الشرطي

من المناسب استخدام المعامل الشرطي الثلاثي عند إعادة قيمة من دالةٍ ما التي كانت ستتطلب استخدام التعبير البرمجي if...else:

var func1 = function( .. ) {
  if (condition1) { return value1 }
  else { return value2 }
}

var func2 = function( .. ) {
  return condition1 ? value1 : value2
}

دعم المتصفحات

الميزة	Chrome	Firefox	Internet Explorer	Opera	Safari
الدعم الأساسي	نعم	نعم	نعم	نعم	نعم

مصادر ومواصفات

• مسودة المعيار ECMAScript Latest Draft.
• معيار ECMAScript 2015 (6th Edition)‎.
• معيار ECMAScript 5.1.
• معيار ECMAScript 1st Edition.