زبان برنامه‌نویسی جاوااسکریپت تقریباً ۳۰ سال است که یکی از زبان‌های محبوب در دنیای توسعه نرم‌افزار به‌شمار می‌رود. چه در توسعه اپلیکیشن‌های وب، اپلیکیشن‌های موبایل، خدمات سمت سرور یا حتی برنامه‌های دسکتاپ، جاوااسکریپت حضوری پررنگ و قدرتمند دارد. در این مقاله قصد داریم به بررسی if-else و switch-case در جاوااسکریپت بپردازیم؛ دو ساختار مهم برای کنترل جریان اجرای کد که پایه بسیاری از تصمیم‌گیری‌های منطقی در برنامه‌نویسی هستند.

Control Flow در جاوااسکریپت چیست؟

در جاوااسکریپت، کدها به‌صورت خط‌به‌خط از ابتدای فایل تا انتها اجرا می‌شوند. این روند که توسط مفسر زبان دنبال می‌گردد، با عنوان جریان کنترل یا

دو ساختار اصلی برای کنترل جریان در جاوااسکریپت تعریف شده‌اند:

• if-else
• switch-case

در ادامه، این دو ساختار را با ذکر مثال بررسی خواهیم کرد تا تأثیر آن‌ها بر جریان اجرای کد را بهتر درک کنیم.

چگونه با بلاک if-else جریان کنترل را مدیریت کنیم؟

کلمه کلیدی if و ترکیب آن با else به ما کمک می‌کند تا دستورات کنترلی در مسیر اجرای کد ایجاد نماییم. با استفاده از if، یک بلاک کد تنها زمانی اجرا می‌شود که یک شرط مشخص برقرار باشد. در صورتی که شرط برقرار باشد، مقدار

مثال ساده‌ای را بررسی می‌کنیم:

اگر سوار اتوبوس بشوی، سر وقت به خانه می‌رسی. حالا اگر بخواهیم این سناریو را به صورت برنامه‌نویسی بنویسیم، ابتدا شرطی به نام

let catchingBus = true;

// Some code here...

if (catchingBus) {
    console.log("I will get home on time");
} 

// Some other code here...

در قطعه کد بالا، چون مقدار متغیر

در کد زیر، هر دو بخش if و else به‌کار رفته‌اند. با توجه به اینکه مقدار شرط

let catchingBus = false;

if (catchingBus) {
    console.log("I will get home on time");
} else {
    console.log("I will be late to get home");
}

گاهی ممکن است برای حل مسائل پیچیده‌تر، بیش از یک جفت if-else نیاز داشته باشیم.
مثالی از یک سیستم نمره‌دهی را بررسی می‌کنیم:

• اگر نمره ما ۹۰ یا بیشتر باشد، نمره A دریافت می‌کنیم؛
• اگر ۸۰ یا بیشتر باشد، نمره B؛
• اگر ۷۰ یا بیشتر باشد، نمره C؛
• در غیر این صورت، مردود می‌شویم.

برنامه این سناریو را با استفاده از if-else می‌نویسیم. از آنجایی که با چندین شرط سروکار داریم، باید از چندین بلاک if و if-else و یک else نهایی استفاده کنیم:

let score = 76;

if (score >= 90) {
    console.log("Grade A");
} else if (score >= 80) {
    console.log("Grade B");
} else if (score >= 70) {
    console.log("Grade C");
} else {
    console.log("Fail");
}

ترکیب چندین دستور if-else یک روش عالی برای بررسی چندین شرط مختلف و اجرای اقدامات متناسب با نتیجه هر شرط (برقراری یا عدم برقراری آن) است.

چگونه با دستور switch-case جریان کنترل را مدیریت کنیم؟

در حالی که استفاده از if-else برای بررسی چندین شرط مختلف بسیار مناسب است، دستور switch-case زمانی کاربردی‌تر است که بخواهیم بر اساس یک مقدار مشخص چندین حالت مختلف را بررسی نماییم.

switch(value) {
    case "case 1": // do something
    case "case 2": // do something
    case "case 3": // do something
    case "case 4": // do something
    default: // do something
}

بر خلاف بلاک if که شرط‌ها را یکی‌یکی بررسی می‌کند،در بلاک switch ابتدا برنامه مقدار موردنظر را به دستور switch ارسال می‌کند، سپس آن را با مقادیر case مقایسه می‌کند. اگر یکی از مقادیر case با مقدار داده شده مطابقت داشته باشد، بلاک کد مربوط به همان case اجرا خواهد شد.

برای خارج شدن از بلاک switch پس از اجرای یک case، معمولاً از دستور break استفاده می‌شود.

 اگر هیچ‌کدام از مقادیر case با مقدار ورودی برابر نباشد، مفسر بلاک default را اجرا خواهد کرد.

در قطعه کد زیر، مقدار متغیر

let position = 10;

switch (position) {
    case 1:
        console.log("Print 1");
        break;
    case 2:
        console.log("Print 2");
        break;
    case 3:
        console.log("Print 3");
        break;
    case 4:
        console.log("Print 4");
        break;

    default:
        console.log("Nothing is matched");
}

مقایسه if-else و switch-case در جاوااسکریپت

جدا از تفاوت‌های سینتکسی این دو روش، نکات کلیدی و مهمی وجود دارد که پیش از انتخاب یکی از این دو روش باید در نظر داشته باشیم:

• وقتی با شرط‌های منطقی پیچیده سر و کار داریم، بهتر است از if-else استفاده کنیم. اما اگر فقط نیاز داشته باشیم یک مقدار ثابت (مثل عدد یا رشته) را بررسی و مقایسه کنیم، switch-case انتخاب مناسب‌تری خواهد بود.
• زمانی که تعداد بلاک‌های if-else زیاد می‌شود، خوانایی کد کاهش پیدا می‌کند. در مقابل، خواندن برچسب‌های case در switch-case راحت‌تر و منظم‌تر است.
• وقتی تعداد شرط‌ها زیاد است، عملکرد if-else ممکن است کندتر از switch-case شود. در بسیاری از موتورهای جاوااسکریپت، دستورات switch به صورت بهینه اجرا می‌شوند. در این موارد، موتور جاوااسکریپت از یک jump table استفاده می‌کند تا مستقیماً به case مربوطه برود، بدون اینکه مجبور باشد تک‌تک شرط‌ها را به ترتیب بررسی کند.

بیایید با یک مثال موضوع را بهتر درک کنیم. کد زیر را با استفاده از if-else نوشته‌ایم:

let value = 3;

if (value === 1) {
    console.log("One");
} else if (value === 2) {
    console.log("Two");
} else if (value === 3) {
    console.log("Three");
} else {
    console.log("Not found");
}

در این مثال:

• مفسر جاوااسکریپت شرط‌های if-else را به‌صورت پیوسته و پشت سر هم بررسی می‌کند.
• موتور جاوااسکریپت تا زمانی که به یک شرط درست برسد، تمام شرط‌های قبل از آن را بررسی می‌کند.
• اگر شرط درست در انتهای بلاک‌ها باشد (مانند مقدار ۳ در این مثال)، همه شرط‌های قبلی بررسی می‌شوند تا در نهایت مقدار مورد نظر پیدا شود. بنابراین در شرایط بدبینانه، عملکرد if-else ممکن است کندتر باشد.

اکنون همین منطق را با switch-case پیاده می‌کنیم:

let value = 3;

switch (value) {
    case 1:
        console.log("One");
        break;
    case 2:
        console.log("Two");
        break;
    case 3:
        console.log("Three");
        break;
    default:
        console.log("Not found");
}

در اینجا:

• موتور جاوااسکریپت ممکن است از قبل یک jump table بسازد.
• بنابراین، مستقیماً به case 3 می‌رود و از بررسی حالت‌های غیرضروری صرف‌نظر می‌کند.
• این باعث می‌شود عملکرد سریع‌تری داشته باشیم. البته توجه به این نکته لازم است که این تفاوت در عملکرد، در شرایطی با تعداد شرط کم، تقریباً ناچیز می‌باشد.

جمع‌بندی

در این مقاله با یکی از مفاهیم پایه‌ای و بسیار مهم در جاوااسکریپت یعنی Control Flow آشنا شدیم و یاد گرفتیم چگونه با استفاده از ساختارهای مختلف، مسیر اجرای کد را مدیریت کنیم.

ساختار if-else و switch-case در جاوااسکریپت دو روش رایج برای تصمیم‌گیری در برنامه‌نویسی هستند. با استفاده از if و if-else می‌توانیم شرایط مختلف را بررسی کرده و بر اساس نتیجه شرط‌ها، مسیر اجرای کد را تغییر دهیم. در مقابل، وقتی بخواهیم بر اساس یک مقدار ثابت مانند عدد یا رشته بین حالت‌های مختلف تصمیم بگیریم، استفاده از switch-case به خوانایی و مرتب بودن کد کمک بیشتری می‌کند.

از نظر عملکرد، گاهی switch-case می‌تواند سریع‌تر از if-else عمل کند؛ به‌ویژه زمانی که با تعداد زیادی شرط ساده مواجه هستیم و موتور جاوااسکریپت از jump table استفاده می‌کند.

در نهایت، انتخاب بین if-else و switch-case به نوع منطق مورد نظر و ساختار پروژه بستگی دارد. مهم‌ترین نکته این است که کدی بنویسیم که هم خوانا و تمیز باشد و هم به راحتی قابل نگه‌داری و توسعه باشد.