القرارات والتكرار: if و === والـ truthy والـ loops

أهلًا بيك. الـ backend طول اليوم بياخد قرارات: المستخدم ده مسموحله؟ الـ request ده صح؟ الـ status كام؟ والقرار في JavaScript بيتكتب بـ if. لو الـ status two hundred اطبع تمام. لو four oh four اطبع مش موجود. غير كده اطبع الرقم. نشغّل.

const status = 404;

if (status === 200) {
  console.log("تمام");
} else if (status === 404) {
  console.log("مش موجود");
} else {
  console.log("حاجة تانية:", status);
}

$ node main.js
مش موجود

مش موجود، لأن الـ status four oh four. البرنامج بيمشي على الشروط بالترتيب، وأول شرط يتحقق بيدخله، والباقي بيتجاهله. خدت بالك إننا بنقارن بـ triple equals؟ تعالى نشوف ليه. هنقارن رقم two hundred بـ string two hundred، مرة بـ double equals، ومرة بـ triple. وكمان zero مع string فاضي، و null مع undefined. نشغّل.

console.log(200 == "200");
console.log(200 === "200");
console.log(0 == "");
console.log(null == undefined, null === undefined);

$ node main.js
true
false
true
true false

double equals قالت إن الرقم والـ string متساويين: true، لأنها بتحوّل الأنواع من وراك. triple equals قالت false، لأنها بتقارن النوع كمان. و zero مع string فاضي طلعوا متساويين بالـ double! تخيل validation بيقبل حقل فاضي على إنه zero. و null و undefined متساويين بالـ double بس. القاعدة في الكورس كله: triple equals دايمًا. دلوقتي نجمع شروط. double ampersand يعني and: الاتنين لازم يتحققوا. double pipe يعني or: واحد كفاية. وعلامة التعجب يعني not، بتقلب القيمة. وتحت، حاجة مهمة جدًّا: القيم اللي بتتحسب false جُوّه if، واسمها falsy. هنلف على شوية قيم ونشوف كل واحدة. نشغّل.

const isLoggedIn = true;
const role = "student";

const canEdit = isLoggedIn && role === "admin";
const canView = isLoggedIn || role === "guest";

console.log({ canEdit, canView, notLogged: !isLoggedIn });

// falsy: القيم دي بتتحسب false جُوّه if
for (const v of [0, "", null, undefined, NaN, false, "0", []]) {
  console.log(typeof v === "string" ? `"${v}"` : v, v ? "truthy" : "falsy");
}

$ node main.js
{ canEdit: false, canView: true, notLogged: false }
0 falsy
"" falsy
null falsy
undefined falsy
NaN falsy
false falsy
"0" truthy
[] truthy

canEdit بـ false، لأن الدور مش admin. canView بـ true، لأنه عامل login. وتحت: zero، والـ string الفاضي، و null، و undefined، و NaN، و false: كلهم falsy. بس string فيه zero، و array فاضية: truthy! وده بيعمل bug مشهور: لو بتتأكد من الكمية بـ if quantity، والمستخدم بعت zero، هتتعامل كأنه ما بعتش حاجة. فلو zero قيمة مقبولة، افحص بـ triple equals undefined، مش بـ if لوحدها. التكرار. عندنا أزمنة رد خمس requests بالـ milliseconds. for العادية: عداد i من zero، طول ما هو أقل من الطول، وبيزيد واحد. و for of: أبسط، بتديك كل قيمة على طول. جُوّاها continue: سيب اللفة دي وروح للي بعدها. و break: اخرج من الـ loop خالص. وفي الآخر while: بتلف طول ما الشرط صح، ومناسبة للمحاولات. نشغّل.

const latencies = [120, 80, 950, 60, 1300];

for (let i = 0; i < latencies.length; i++) {
  console.log(`request ${i}: ${latencies[i]}ms`);
}

let slow = 0;
for (const ms of latencies) {
  if (ms < 100) continue;
  if (ms > 1000) {
    console.log("فيه request أبطأ من ثانية، نوقف العد");
    break;
  }
  slow++;
}
console.log("بطيئة قبل الوقفة:", slow);

let tries = 0;
while (tries < 3) {
  tries++;
  console.log("محاولة", tries);
}

$ node main.js
request 0: 120ms
request 1: 80ms
request 2: 950ms
request 3: 60ms
request 4: 1300ms
فيه request أبطأ من ثانية، نوقف العد
بطيئة قبل الوقفة: 2
محاولة 1
محاولة 2
محاولة 3

أول loop طبعت الخمسة بأرقامهم من zero. التانية: سابت التمانين والستين بالـ continue، وعدّت one twenty و nine fifty، ولما وصلت للـ thirteen hundred عملت break. فالعداد اتنين. و while عملت تلات محاولات. خد بالك: لو نسيت tries plus plus، الـ while مش هتقف أبدًا، والبرنامج هيعلّق. ده اسمه infinite loop. التحدي: تقرير latency. تصنّف كل request: fast لو أقل من مِيّة، ok لحد تسعمية تسعة وتسعين، slow من ألف وطالع. ولو أي request أكتر من ألف ومتين تطبع warning. وفي الآخر سطر ملخص. وممنوع break، لازم تعدّ الكل. التفاصيل في الكومنت.

الحل. تلات عدادات بـ let. جُوّه الـ for of: if أقل من مِيّة، else if أقل من ألف، else. والـ warning ليه if لوحده بره السلسلة، لأنه شرط تاني مستقل. وفي الآخر template literal. نشغّل.

const latencies = [120, 80, 950, 60, 1300, 400, 30];

let fast = 0;
let ok = 0;
let slow = 0;

for (const ms of latencies) {
  if (ms < 100) {
    fast++;
  } else if (ms < 1000) {
    ok++;
  } else {
    slow++;
  }
  if (ms > 1200) {
    console.log(`تحذير: ${ms}ms`);
  }
}

console.log(`fast=${fast} ok=${ok} slow=${slow}`);

$ node main.js
تحذير: 1300ms
fast=3 ok=3 slow=1

الـ warning، وبعده تلاتة وتلاتة وواحد. الدرس الجاي: الـ functions، لأن أي backend هو functions جُوّه functions.