درآمدی بر دستورات شرطی در جاوااسکریپت

در فرآیند توسعهٔ نرم‌افزار به کرات پیش می‌آید که بسته به شرایطی مختلف نیاز است تا از بین چند گزینه یکی را انتخاب کنیم و ادامهٔ برنامه به آن گزینهٔ انتخابی بستگی خواهد داشت که در همین راستا در این آموزش قصد داریم دستورات کنترل‌کننده را در جاوااسکریپت با ذکر مثال توضیح دهیم.

دستورات شرطی if … else در زبان جاوااسکریپت
دستور if اکسپرشن‌های منطقی را ارزیابی می‌کند و با توجه به نتیجه‌ای که از آن‌ها به دست می‌آید، دستورات مد نظر دولوپر را اجرا می‌کند و نیاز به توضیح نیست که اغلب اوقات دستور if به تنهایی استفاده می‌شود و اصلاً نیازی به بیان قسمت دوم یا else نیست اما اگر بخواهیم از دستورات else استفاده کنیم، حتماً باید پیش از else دستور if آمده باشد. ساده‌ترین سینتکس یک دستور شرطی در جاوااسکریپت به شکل زیر است:

if (condition) {
    // statements
}

در اینجا Condition (شرط) می‌تواند هر عبارتی باشد که در نهایت برابر یک مقدار بولین true یا false ارزیابی شود به طوری که اگر نتیجهٔ این شرط true باشد، یا به عبارتی شرط برقرار باشد، دستورات داخل if اجرا می‌شوند و در صورتی که نتیجهٔ شرط false باشد، جاوااسکریپت کدهای درون بلوک if را نادیده خواهد گرفت و از آن‌ها رد می‌شود. حال اگر بخواهیم در صورت برقرار نبودن نتیجهٔ شرط کار دیگری انجام شود، از else باید استفاده کنیم:

var age = 19;
if (age < 18) {
    alert("You are not allowed to drive a vehicle.");
} else {
    alert("You are of legal age to drive.");
}

در اینجا می‌خواهیم بررسی کنیم ببینیم که آیا سن فرد زیر 18 سال است یا خیر به طوری که چنانچه سن فرد زیر 18 سال باشد، اجازهٔ رانندگی داده نمی‌شود و اگر بالای 18 سال باشد مجوز راندن وسایل نقلیه صادر خواهد شد اما همان‌طور که می‌بینیم مقدار در نظر گرفته شده برای متغیر age برابر 19 است فلذا زمانی که مفسر این زبان به if می‌رسد و شرط آن را بررسی می‌کند، متوجه می‌شود که نتیجهٔ آن برابر false است و به همین دلیل کدهای داخل بلوک if نادیده گرفته می‌شوند و مفسر به سراغ else می‌رود. در حقیقت، نتیجهٔ شرط این بخش برابر با true است و شرط برقرار می‌باشد و به همین دلیل کد‌های داخل بلوک else اجرا می‌شوند و عبارت «.You are of legal age to drive» در معرض دید کاربر قرار خواهد گرفت (جهت آشنایی بیشتر با متغیرها در جاوااسکریپت می‌توانید به آموزش آشنایی با مفهوم متغیر در زبان برنامه‌نویسی جاوااسکریپت مراجعه نمایید.)

بدین ترتیب، با استفاده از دستورات if و else در کنار یکدیگر می‌توان دو راه را برای ادامهٔ برنامه تعیین کرد که بر اساس نتیجهٔ شرط، یکی از راه‌ها انتخاب خواهد شد اما در عین حال گاهی اوقات پیش می آید که می‌خواهیم چندین حالت مختلف را برای برنامه در نظر بگیریم و اساساً بیش از دو حالت داریم!

بسیاری از زبان‌های برنامه‌نویسی، علاوه بر if و else دارای یک کلیدواژهٔ ترکیبی به نام elseif هستند که با استفاده از آن می‌توان به تعداد نامحدود شرط جدید برای برنامه تعریف کرد تا آنکه یکی از شرط‌ها برابر true شود و کد مرتبط با آن به اجرا در آید اما جاوااسکریپت از چنین کلیدواژه‌ای برخوردار نیست و در مقابل برای تعیین چندین شرط به طور هم‌زمان در جاوااسکریپت می‌باید یکسری if و else را به صورت پشت سر هم نوشت:

if (time < 12) {
	document.write("Good Morning!");
} else if (time < 17) {
	document.write("Good Afternoon!");
} else if (time < 20) {
	document.write("Good Evening!");
} else {
	document.write("Good Night!");
}

همان‌طور که می‌بینیم، در ابتدا یک دستور if با شرط time < 12 نوشته شده سپس در بخش else یک Space (فاصله) می‌گذاریم و دستور شرطی بعدی if را می‌گذاریم و به همین روال تا هر مقدار شرط که نیاز باشد را تعیین می‌کنیم و در انتها نیز یک else نهایی می‌گذاریم که در صورتی اجرا خواهد شد که کلیهٔ دستورات شرطی قبل برابر با false گردند.

در تفسیر مثال فوق، زمانی که مفسر جاوااسکریپت مقدار متغیر time را می‌خواند، از بالا یک به یک شرط‌ها را بررسی می‌کند. فرض کنیم که مقدار time برابر با 18 باشد که در این صورت اولین و دومین دستورات شرطی if که به ترتیب دارای شروط time < 12 و time < 17 هستند معادل false خواهند بود و نادیده گرفته می‌شوند اما سومین if دارای نتیجهٔ true است و به همین دلیل مفسر این زبان کدهای درون آن را اجرا می‌کند. پس از اجرای کد، بخش شرط‌ها به پایان می‌رسد و جاوااسکریپت به سراغ سایر کدهایی می‌رود که پس از آخرین else قرار دارند (به بیانی دیگر، اگر ده‌ها شرط مختلف با استفاده از if و else تعیین کنید و تنها اولین شرط معادل true باشد، کدهای درون اولین بلوک اجرا می‌شوند و سایر دستورات شرطی به طور کلی نادیده گرفته می‌شوند.)

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

switch (expression) {
    case value1:
        //statements
    break;
    case value2:
        //statements
    break;
    case value3:
        //statements
    break;
    default:
        //statements
    break;
}

در داخل پرانتزهایی که مقابل دستور switch قرار دارند، یک اکسپرشن قرار می‌گیرد که معمولاً یک متغیر است. در ابتدا مقدار این اکسپرشن محاسبه می‌شود و پس از آن، جاوااسکریپت به سراغ شرط‌ها (کیس‌هایی) که در داخل switch قرار دارند رفته سپس اگر یکی از این کیس‌ها با مقدار اکسپرشن هم‌خوانی داشت، کدهای داخل آن کیس اجرا خواهد شد و در صورتی که هیچ کدام از کیس‌ها با مقدار اکسپرشن هم‌خوانی نداشته باشند، دستور default اجرا شده سپس جاوااسکریپت از سوئیچ خارج می‌شود.

همواره به خاطر داشته باشیم که یک اصطلاحاً Best Practice در کدنویسی این است که در دستور سوئیچ حتماً default را قرار دهیم تا در صورتی که اکسپرشن ورودی با هیچ کدام از کیس‌ها هم‌خوانی نداشت، دستورات مرتبط با default اجرا گردند. به عبارتی، قرار دادن default دلخواه است اما همواره توصیه می‌شود که آن را به عنوان آخرین کیس در نظر بگیریم.

نکته‌ای که در اینجا باید مد نظر داشته باشیم، دستور break است که دقیقاً پس از هر case آورده می‌شود و وظیفه‌اش آن است تا دستور توقف و خروج از سوئیچ را صادر کند. اگر این break را بلافاصله پس از هر case نگذاریم، مفسر تمامی دستوراتی که در کیس‌های بعدی وجود دارند را نیز اجرا خواهد کرد؛ حتی اگر شرط آن‌ها برابر با true نباشد!

فراموش کردن استفاده از break در سوئیچ می‌تواند مشکلات بزرگی ایجاد کند و از همین روی همواره آن را باید درج کرد زیرا از آنجایی که مفسر تمامی کدهای داخل کیس‌های بعدی را نیز اجرا می‌کند، نتایج غیرقابل‌پیش‌بینی به وجود می‌آیند و جالب است بدانید که مشکلات به وجود آمده توسط یکسری break فراموش‌شده را نمی‌توان به راحتی پیدا کرده و دیباگ نمود چرا که معمولاً هیچ‌گونه ارور و یا خطایی در برنامه مشاهده نمی‌شود اما هر بخشی را که اجرا می‌کنیم، نتایج اشتباهی را به دست می‌آوریم.

همان‌طور که پیش از این گفته شد، علاوه بر استفاده از break همواره باید برای دستورات سوئیچ یک حالت default نیز تعریف کنیم و بهتر است که همواره این کیس را در آخر و پس از تمامی کیس‌های دیگر قرار دهیم. بدین ترتیب، حتی اگر هیچ کدام از کیس‌ها اجرا نشوند، یک دستور پیش‌فرض وجود دارد که ادامهٔ روند اجرای برنامه بر آن اساس پیش خواهد رفت. همچنین توجه داشته باشیم در صورتی که default را در انتهای سوئیچ قرار دهیم، دیگر نیازی به استفاده از break پس از آن نیست چرا که در هر صورت پس از این دستور، سوئیچ پایان می‌یابد اما در عین حال برخی برنامه‌نویسان از روی عادت یک break دیگر هم پس از default می‌گذارند که اصلاً ضرورتی ندارد.

اکنون می‌خواهیم با نحوهٔ کار با سوئیچ در زبان جاوااسکریپت به صورت عملی آشنا شویم. برای مثال، برنامهٔ زیر را در نظر می‌گیریم:

var language = "Spanish";
switch (language) {
    case "English":
        console.log("Hello");
        break;
    case "Spanish":
        console.log("Hola");
        break;
    case "German":
        console.log("Guten Tag");
        break;
    case "Persian":
        console.log("سلام");
        break;
    default:
        console.log("Sorry, I don't speak " + language + "!");
}

فرض کنیم که قرار است یک وب‌سایت طراحی کنیم که با توجه به زبان انتخابی کاربر، پیغام خوشامدگویی را به همان زبان نمایش دهد. یکی از راه‌های اجرای این ایده، استفاده از دستور switch است به طوری که در اینجا متغیری به نام language وجود دارد که مقدار اولیه‌اش استرینگ «Spanish» است که قرار است به عنوان اکسپرشن ورودی در switch استفاده شود.

در اینجا می‌خواهیم مقدار متغیر language را برای هر کدام از کیس‌های درون switch بررسی کنیم که برای این منظور، داخل دستور switch هر تعداد case که نیاز داشته باشیم را می‌نویسیم و نیاز به توضیح نیست که علائم " " جلوی هر کیس به نوعی مانند دروازهٔ ورود به آن کیس عمل می‌کنند. برای نمونه، اولین کیس در مثال بالا می‌گوید که اگر اکسپرشن ورودی سوئیچ دارای مقداری برابر با «English» بود، پس می‌توانید وارد کیس شده و کدهای درون آن را اجرا کنید و در غیر این صورت، باید آن را نادیده بگیرید.

حال از آنجایی که مقدار language برابر با «Spanish» است کیس اول نادیده گرفته می‌شود و مفسر جاوااسکریپت به سراغ کیس دوم می‌رود و از آنجایی که شرط ورود به کیس دوم دقیقاً برابر با مقدار متغیر language است، پس کدهای درون این کیس اجرا شده و عبارت «Hola» به کاربر نمایش داده می‌شود و در ادامه مفسر با دستور break مواجه می‌شود و از همین روی از بررسی سایر کیس‌ها خودداری می‌کند و کاملاً از دستور سوئیچ خارج می شود چرا که break به نوعی مانند «سوت پایان مسابقه» می‌ماند و جاوااسکریپت بخش مربوط به آن را تکمیل‌شده تلقی می‌کند.

در برنامهٔ فوق اگر کاربر زبانی را انتخاب کند که ما از قبل در کیس‌های switch پیش‌بینی نکرده باشیم (مثلاً زبان French)، جاوااسکریپت با بررسی تمامی کیس‌ها از بالا به پایین متوجه می‌شود که این شرط در سوئیچ وجود ندارد و به همین دلیل به سراغ بخش default می‌رود و کدهای آن را اجرا می‌کند و عبارت «!Sorry, I don’t speak French» را نمایش می‌دهد و پس از آن نیز برنامه کاملاً از سوئیچ خارج می‌شود.