parsgreen.com
article

کار با switch و case در جاوا اسکریپت (JavaScript)

javascript-switch-case

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

دستور switch در جاوا اسکریپت (JavaScript)


در بحث پیشین دیدیم که چگونه با if و else و ترکیب آنها یعنی elseif دستوراتی شرطی (Conditional Statements) را تعریف کنیم، همچنین با حلقه های for و while به کمک مثال هایی آشنا شدیم، اکنون می خواهیم ببینیم که دستور switch چه کاربردی در برنامه نویسی جاوا اسکریپت دارد.
به صورت ساده از دستور switch برای انتخاب موارد (case) گوناگون بر اساس درست شدن (true شدن) یک رابطه استفاده می شود، مثلا فرض کنید برای روزهایی که هوا بارانی است، از قفسه لباس های خود، کاپشن را برمی گزینیم و برای روزهای آفتابی و گرم، از لباسی پارچه ای استفاده می کنیم، یک دست لباس ساده نیز برای مواقعی که هوا نه گرم و نه سرد (معمولی) است داریم، کارکرد switch و case شباهت زیادی به این رفتار ما دارد، یعنی با توجه به شرایط بیرونی که برایش تعریف می کنیم، یکی از موارد (case) درون خود را به خروجی ارسال می کند، به مثال زیر توجه کنید.
<script type="text/javascript">
var lang = 'Farsi';
switch (lang){
    case 'Farsi':
    document.write("زبان سیستم فارسی است!<br />");
    break;
    case 'English':
    document.write("system language is English!<br />");
    break;
    default:  
    document.write("Unknown language<br />")
}
</script>
توضیح:
- در مثال بالا ابتدا در متغیر فرضی lang زبان فارسی را تنظیم کرده ایم، سپس در قسمت مربوط به دستور switch، متغیر lang را به عنوان مقادیر به آن داده ایم که به این صورت switch بین case های خود جستجو نموده و مقادیر مشابه با مقدار متغیر lang را انتخاب می کند و به خروجی می دهد (با دستور document.write)، اگر هیچ کدام از موارد با مقادیر متغیر lang برابر نباشد، قسمت مربوط به خروجی پیش فرض یا default اجرا خواهد شد.
- دقت کنید که پس از هر قسمت از case، یک break آمده که مفهوم آن خاتمه خواندن switch است، یعنی هرجا حاصل جستجوی دستور switch درست (true) باشد، قسمت مربوط به break اجرا شده و جستجوی switch خاتمه می یابد.
- اگر break را از کد بالا حذف کنیم، همه مقادیر case ها به خروجی ارسال می شوند، چون کد را باید در جایی متوقف می کردیم که این کار را انجام نداده ایم.

استفاده از دستور switch در حالت داینامیک


اصولا زبان های برنامه نویسی ساخته شده اند تا به طور هوشمندانه کارها را کنترل کنند، لذا در مورد دستور switch هم می توان از مقادیری داینامیک و متغیر برای مقایسه case های آن استفاده کرد، مثلا با توجه به نام کاربری افراد یا زمان فعلی سیستم پیامی به آنها نشان داد، یا در حالت های پیشرفته تر با دریافت اختلاف زمانی کشور کاربر و مقایسه آن با سرور، کارها را به وقت محلی تنظیم نمود و خیلی چیزهای دیگر، در مثال زیر  با استفاده از توابع Date و getDay، عدد متناظر با هر روز (از روزهای هفته) را دریافت و با توجه به آن، یکی از موارد (case) ها را به خروجی ارسال کرده ایم، ملاحظه می کنید که بر اساس روزهای هفته خروجی ما نیز متغیر خواهد بود، به اینصورت می توان به صورت داینامیک از  switch و case در جاوا اسکریپت استفاده کرد.
<script type="text/javascript">
var date = new Date()
var today = date.getDay()
switch (today){
    case 1:
    document.write("با توجه به تاریخ سیستم شما، امروز دوشنبه است!<br />");
    break;
    case 2:
    document.write("با توجه به تاریخ سیستم شما، امروز سه شنبه است!<br />");
    break;
    case 3:
    document.write("با توجه به تاریخ سیستم شما، امروز چهارشنبه است!<br />");
    break;
    case 4:
    document.write("با توجه به تاریخ سیستم شما، امروز پنج شنبه است!<br />");
    break;
    case 5:
    document.write("با توجه به تاریخ سیستم شما، امروز جمعه است!<br />");
    break;
    case 6:
    document.write("با توجه به تاریخ سیستم شما، امروز شنبه است!<br />");
    break;
    case 7:
    document.write("با توجه به تاریخ سیستم شما، امروز یکشنبه است!<br />");
    break;            
    default:  
    document.write("بروز مشکل در نمایش تاریخ سیستم!<br />")
}
</script>
توضیح:
- تابع date و getDay در حالت عادی با روز و زمان میلادی کار می کنند، لذا بر اساس اینکه یکشنبه روز تعطیل در تقویم میلادی محسوب می شود (روز هفتم)، شروع شمارش روزهای هفته از دوشنبه (case 1) خواهد بود.
- اعدادی که به عنوان مقادیر به case ها داده شده اند، در واقع حاصل و نتیجه برگردانده شده از قسمت date.getDay و با توجه به تاریخ تنظیم شده سیستم است که بین 1 تا 7 در نوسان است.
- برای دیدن نحوه عملکرد کدهای جاوا اسکریپت، کافی است آن را در یک صفحه یا ویرایشگر html مانند برنامه Adobe dreamweaver کپی کرده و با فرمت html ذخیره نمائید و در مرورگر خود آن را اجرا کنید.

پیش نمایش آنلاین


در زیر کد و پیش نمایش آنلاین مثال بالا را جهت نمونه می توانید ملاحظه کنید.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>وبگو | استفاده از دستور switch در جاوا اسکریپت</title>
<!-- http://webgoo.ir -->
<style type="text/css">
body{
    font-family:Tahoma, Geneva, sans-serif;
    font-size:12px;
    direction:rtl;
}
</style>
<script type="text/javascript">
//<![CDATA[
var date = new Date()
var today = date.getDay()
switch (today){
    case 1:
    document.write("با توجه به تاریخ سیستم شما، امروز دوشنبه است!<br />");
    break;
    case 2:
    document.write("با توجه به تاریخ سیستم شما، امروز سه شنبه است!<br />");
    break;
    case 3:
    document.write("با توجه به تاریخ سیستم شما، امروز چهارشنبه است!<br />");
    break;
    case 4:
    document.write("با توجه به تاریخ سیستم شما، امروز پنج شنبه است!<br />");
    break;
    case 5:
    document.write("با توجه به تاریخ سیستم شما، امروز جمعه است!<br />");
    break;
    case 6:
    document.write("با توجه به تاریخ سیستم شما، امروز شنبه است!<br />");
    break;
    case 7:
    document.write("با توجه به تاریخ سیستم شما، امروز یکشنبه است!<br />");
    break;            
    default:  
    document.write("بروز مشکل در نمایش تاریخ سیستم!<br />")
}
//]]>
</script>
</head>
<body>
<br />
<hr />
یکی از مقادیر case ها با توجه به روزهای هفته و تاریخ سیستم شما به خروجی ارسال شده است.
</body>
</html>
پیش نمایش
sectionدسته بندی: آموزش مقدماتی » JavaScript
related مطالب بیشتر:
» تعریف متغیرها، محاسبات و عملگرها در جاوا اسکریپت (javascript)
» مقایسه (Comparison) و شرط (If و Else) در جاوا اسکریپت (JavaScript)
» کار با تاریخ و زمان در جاوا اسکریپت (JavaScript)
» کار با متد getElementById و innerHTML در جاوا اسکریپت (JavaScript)
» رویداد ها (events) در جاوا اسکریپت (JavaScript)
commentنظرات (۵ یادداشت برای این مطلب ارسال شده است)
نویسنده: صنوبر
زمان: ۱۹:۰۰:۴۱ - تاریخ: ۱۳۹۲/۰۸/۱۶
بعضی مواقع در switch عدد 1 برابر true و 0 برابر false میشود
نویسنده: مهران
زمان: ۰۸:۲۶:۳۶ - تاریخ: ۱۳۹۲/۱۱/۰۸
خسته نباشید و بسیار عالی
میخواستم بدون اون new بکار رفته قبل از تابع تاریخ به چه دلیل هست در اینجا
var date = new Date()
و اینکه چرا برای به دست آوردن روز تابع date را با استفاده از یک نقطه به تابع getDay متصل کردید. ارگومانی برای محدود سازی بر این تابع تاریخ وجود ندارد یا کلا باید توابع در جاوا اسکریپت برای همچین کاری با هم ترکیب بشن و اینکه برای ترکیب دو تابع با هم از نقطه استفاده میشه همیشه ؟
var today = date.getDay()
پاسخ: 
سلام
new در دستورات جاوا اسکریپت برای ایجاد یک object از یک کلاس به کار می رود (یعنی اینجا date یک شی جدید از Date است)، عبارت نقطه هم یعنی متد یا متغیر قبلی با ترکیب متد بعدی دستور خاصی را شکل می دهد، به فرض وقتی date یک شی از نوع Date است، می تواند متدی با نام getDay داشته باشد (چون getDay خود زیرمجموعه Date است) که نتیجه روزی از روزهای هفته است.
نویسنده: علی رضا
زمان: ۱۱:۵۵:۵۷ - تاریخ: ۱۳۹۴/۰۱/۲۸
سلام
ممنون از توضیحات خوبتون
می شود برنامه ی سوئیچ را در جاوا اپلیکیشن هم استفاده کرد ؟
پاسخ: 
سلام
سوالتان مبهم است! جاوا اسکریپت با جاوا فرق می کند!
نویسنده: qaasem
زمان: ۱۱:۵۷:۰۴ - تاریخ: ۱۳۹۴/۰۳/۲۵
دمتگرم داداش
نویسنده: kia
زمان: ۰۴:۴۱:۰۹ - تاریخ: ۱۳۹۴/۰۴/۱۰
ممنون از وب خوبتون




more لطفا دقت کنید که یادداشت های زیر منتشر نشده و حذف خواهند شد:
- یادداشت های خارج از موضوع این مطلب.
- سوالات کلی، غیر ضروری و مشکلاتی که هیچ تلاشی برای رفع آن نکرده باشید.
- نظرات حاوی کدها و اسکریپت های خیلی طولانی (به طور مثال کد کامل قالب وبلاگ).

9 × 8
 refresh
آگهی
seonab.com
طراحی نرم افزار اندروید
رنگین کمان عکس
Ranginkamaan.com

آرشیو عکس های باکیفیت با موضوعات متنوع...