انتقل إلى المحتوى

١.٥ الجمل الشرطية — الجزء الأول

كتابة الشروط

هل تتذكّر مشروع الخصم؟ إليك الشيفرة:

var customer1 = "Soso";
var customer1GetsDiscount = 150 >= 100;
console.log(customer1 + " got the  discount: " + customer1GetsDiscount ); //Soso gets discount: true
var customer2 = "Sami";
var customer2GetsDiscount = 50 >= 100;
console.log(customer2 + " got the  discount: " + customer2GetsDiscount ); //Sami gets discount: false

لمعرفة ما إذا كان العميل يستحق الخصم، نقارن مجموع طلبه بحدّ 100 دولار. نكرّر الاختبار لكل عميل، مثل Sami: var customer2GetsDiscount = 50 >= 100

أليس من الأفضل كتابة الاختبار مرة واحدة؟ تأمّل الشيفرة التالية:

var customerPaid = 50;
if(customerPaid >= 100){
  var customerGetsDiscount = true;
}else{
  var customerGetsDiscount = false;
}
  1. أنشأنا هنا متغيرًا باسم customerPaidيحمل مجموع طلب العميل.
  2. ثم تحقّقنا مما إذا كانت قيمة customerPaidأكبر من أو تساوي 100.
  3. إذا تحقق الشرط، يُنشأ متغير آخر اسمه customerGetsDiscount، ونُسنِد إليه true.
  4. وإذا لم يتحقق، نُسنِد false إلى المتغير customerGetsDiscount

لنجرّب الشيفرة مع مجموع طلب Soso:

var customerPaid = 150;
if(customerPaid >= 100){
  var customerGetsDiscount = true;
}else{
  var customerGetsDiscount = false;
}
console.log(customerGetsDiscount);

ستحصل على: true

لنجرّبها مع مجموع طلب Sami:

var customerPaid = 50;
if(customerPaid >= 100){
  var customerGetsDiscount = true;
}else{
  var customerGetsDiscount = false;
}
console.log(customerGetsDiscount);

ستحصل على: false

لنجرّبها مع عميل آخر اسمه Ali دفع 200 دولار:

var customerPaid = 200;
if(customerPaid >= 100){
  var customerGetsDiscount = true;
}else{
  var customerGetsDiscount = false;
}
console.log(customerGetsDiscount);

ستحصل على: true

رائع! لنتدرّب!

تدريبات

التمرين 1: إذا كان 30 أقل من 80، فاعرض true في وحدة التحكم؛ وإلا فاعرض false.

if(30 > 80){
  console.log(true);
}else{
  console.log(false);
}

ستحصل على: true

التمرين 2: إذا كان الاسم المُعطى يساوي Ali، فاعرض "Allowed"؛ وإلا فاعرض "NOT allowed".

var providedName = "Ali";
if(providedName == "Ali"){
  console.log("Allowed");
}else{
  console.log("Not Allowed");
}

ستحصل على: Allowed.

لنغيّر الاسم الذي نختبره:

var providedName = "Ola";
if(providedName == "Ali"){
  console.log("Allowed");
}else{
  console.log("Not Allowed");
}

ستحصل على: Not allowed.

جيد!

التمرين 3: إذا كانت حرارة الشخص أكبر من أو تساوي 37.5، فاعرض "Above 37.5" في وحدة التحكم.

var personTemp = 38;
if(personTemp >= 37.5){
  console.log("Above 37.5");
}

ستحصل على: Above 37.5.

جرّب مع شخص آخر:

var personTemp = 37;
if(personTemp >= 37.5){
  console.log("Above 37.5");
}

لن تظهر أي نتيجة.

لاحظ أن لم نحتج إلى إضافة فرع else هنا؛ استخدمه عند الحاجة فقط.

التمرين 4: إذا كانت حرارة الغرفة أقل من أو تساوي 25، فاعرض "It can be normal or cold." في وحدة التحكم.

var roomTemp = 15;
if(roomTemp <= 25){
  console.log("It can be normal or cold.");
}

ستحصل على: It can be normal or cold.

جرّب درجة حرارة أخرى:

var roomTemp = 70;
if(roomTemp <= 25){
  console.log("It can be normal or cold.");
}

لن تظهر أي نتيجة في وحدة التحكم.

التمرين 5: إذا لم يكن ما اشتراه الطفل آيس كريم، فاعرض "You are such a good kid"؛ وإلا فاعرض "You should not buy ice cream".

var kidBuys = "bread";
if(kidBuys != "ice cream"){
  console.log("You are such a good kid");
}else{
  console.log("You should not buy ice cream");
}

ستكون النتيجة: You are such a good kid.

لنغيّر ما اشتراه الطفل:

var kidBuys = "ice cream";
if(kidBuys != "ice cream"){
  console.log("You are such a good kid");
}else{
  console.log("You should not buy ice cream");
}

ستكون النتيجة: You should not buy ice cream.

التمرين 6: إذا كان نوع قيمة المتغير "number"، فاعرض "It is a number" في وحدة التحكم.

var testVar = 10;
if(typeof testVar === 'number'){
  console.log("It is a number");
}

ستكون النتيجة: It is a number.

غيّر قيمة testVar:

var testVar = "Hello";
if(typeof testVar === 'number'){
  console.log("It is a number");
}

لن تظهر أي نتيجة في وحدة التحكم.

التمرين 7: إذا كان نوع قيمة المتغير "string"، فاعرض "It is a string" في وحدة التحكم.

var testVar = 10;
if(typeof testVar === 'string'){
  console.log("It is a string");
}

لن تظهر أي نتيجة في وحدة التحكم.

غيّر قيمة testVar:

var testVar = "Hello";
if(typeof testVar === 'string'){
  console.log("It is a string");
}

ستكون النتيجة: It is a string

التمرين 8: إذا كان نوع قيمة المتغير "boolean"، فاعرض "It is a Boolean" في وحدة التحكم.

var testVar = true;
if(typeof testVar === 'boolean'){
  console.log("It is a boolean");
}

ستكون النتيجة: It is a boolean.

غيّر قيمة testVar:

var testVar = "true";
if(typeof testVar === 'boolean'){
  console.log("It is a boolean");
}

لن تظهر أي نتيجة في وحدة التحكم.

التمرين 9: إذا أدخل المستخدم كلمة المرور الصحيحة، وهي 123، فاضبط loginAllowedعلى true؛ وإلا فاضبطه على false. اعرض قيمة loginAllowed في وحدة التحكم.

var requiredPassword = "123";
var userPassword = "xyz";
if(userPassword !== requiredPassword){
  var loginAllowed = false;
}else{
  var loginAllowed = true;
}
console.log(loginAllowed);

ستحصل على: false

التمرين 10: كرّر التمرين 9، واضبط userPassword على 123.

var requiredPassword = "123";
var userPassword = "123";
if(userPassword !== requiredPassword){
  var loginAllowed = false;
}else{
  var loginAllowed = true;
}
console.log(loginAllowed);

ستحصل على: true

ملاحظة (١) != يتحقّق من عدم تساوي القيم مع السماح بتحويل النوع، بينما !== يتحقّق من عدم تطابق القيم أو الأنواع دون تحويل.

كتابة شروط إضافية

تعلّمنا الكثير! ماذا لو أردنا كتابة شروط إضافية؟ لنعد إلى التمرين 4 في القسم السابق، حيث اختبرنا حرارة الغرفة. إذا كانت أقل من أو تساوي 25، نعرض رسالة. يمكننا القول:

  1. أقل من 25 قد تعني حرارة معتدلة أو باردة أو شديدة البرودة.

  2. أقل من 15 قد تعني جوًا باردًا أو شديد البرودة.

  3. أقل من 0 تعني جوًا شديد البرودة.

نحتاج إلى شروط إضافية لوصف الحرارة بدقة. يمكن كتابة ما يلي:

var roomTemp = 6;
if(roomTemp <= 25){
  console.log("It can be normal, cold or extremely cold");
}
if(roomTemp <15){
  console.log("It can be a bit cold or extremely cold");
}
if(roomTemp <0){
  console.log("It is extremely cold");
}

ستكون النتيجة:

It can be normal, cold or extremely cold
It can be a bit cold or extremely cold

ماذا حدث هنا؟

  1. يقرأ محرّك JavaScript الشيفرة سطرًا بسطر من الأعلى إلى الأسفل.

  2. يقرأ الشرط الأول roomTemp <= 25، وهو متحقق لأن 6 أقل من 25، فيعرض It can be normal, cold or extremely cold في وحدة التحكم.

  3. يقرأ الشرط الثاني roomTemp <15، وهو متحقق لأن 6 أقل من 15، فيعرض It can be a bit cold or extremely cold في وحدة التحكم.

  4. يقرأ الشرط الثالث roomTemp <0، وهو غير متحقق لأن 6 ليست أقل من 0، فلا يعرض شيئًا.

تعلّمنا شيئًا جديدًا، لكننا نريد وصفًا واحدًا للحرارة بدلًا من عدة أوصاف. لنجرّب طريقة أخرى:

var roomTemp = 6;
if(roomTemp <= 25 && roomTemp >= 20){
  console.log("The weather is nice.");
}
if(roomTemp < 20 && roomTemp >= 10){
  console.log("Well, it is a bit cold!");
}
if(roomTemp <10 && roomTemp >= 5){
  console.log("Woe, it is really cold!");
}
if(roomTemp <0){
  console.log("It is extremely cold!");
}

ما الذي يحدث هنا؟ ما وظيفة &&? && يعني «و» المنطقية. لنوضّح أكثر:

  1. تقرأ JavaScript roomTemp <= 25 && roomTemp >= 20: 6 <= 25 && 6 >= 20: هل 6 أقل من أو تساوي 25؟ نعم. وهل 6 أكبر من أو تساوي 20؟ لا. إذن true وfalse تعطيان false، فلا يتحقق الشرط.

  2. تقرأ JavaScript roomTemp < 20 && roomTemp >= 10: 6 < 20 && 6 >= 10: هل 6 أقل من 20؟ نعم. وهل 6 أكبر من أو تساوي 10؟ لا. إذن الشرط غير متحقق.

  3. تقرأ JavaScript roomTemp <10 && roomTemp >= 5: 6 <10 && 6 >= 5: هل 6 أقل من 10؟ نعم. وهل 6 أكبر من أو تساوي 5؟ نعم. إذن الشرط متحقق، وتظهر الرسالة "Woe, it is really cold!".

  4. تقرأ JavaScript roomTemp <0: 6 <0 هل 6 أقل من 0؟ لا، إذن الشرط غير متحقق.

ملاحظة (٢): && عامل منطقي تكون نتيجته true عند تحقق العبارتين معًا.