• توجه: در صورتی که از کاربران قدیمی ایران انجمن هستید و امکان ورود به سایت را ندارید، میتوانید با آیدی altin_admin@ در تلگرام تماس حاصل نمایید.

شرط و مقایسه در جاوا اسکریپت

sky boy

متخصص بخش برنامه نویسی
پیش از این با جاوا اسکریپت (JavaScript) و کارکردهای آن در صفحات وب در این تاپیک و در اینجا،آشنا شدید.
گفته شد که این زبان تنها در مرورگر کاربران اجرا می شود (سمت کاربر) و به نوعی محدود به آن است،
همچنین محاسبات و عملگرهای اصلی را شناختیم و با مثال هایی از آنها کار کردیم،
اکنون و در این مطلب کمی بیشتر وارد دنیای جذاب و کمی پیچیده برنامه نویسی با جاوا اسکریپت می شویم و با بررسی عملگرهای مقایسه (Comparisons) و شرط (If و Else)
و نحوه تعریف و استفاده از آنها با کمک مثال بپردازیم .

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

sky boy

متخصص بخش برنامه نویسی
(JavaScript Comparisons) عملگرهای مقایسه در جاوا اسکریپت :

عملگرهای مقایسه ای، شرایطی را مهیا می کنند که به کمک آنها دو طرف یک رابطه را باهم مقایسه می کنیم،
به فرض ما متغیری داریم به نام age که مقدار آن 12 است، حال می خواهیم مقایسه کنیم:
آیا متغیر age مساوی 12 است؟، برای مقایسه برابری دو طرف از علامت == استفاده می کنیم:

کد:
[/SIZE]
age == 12[SIZE=3]

آیا متغیر age مساوی 13 نیست؟، برای مقایسه برابر نبودن دو طرف از علامت =! استفاده می کنیم:

کد:
[/SIZE]
age != 13[SIZE=3]

گاهی نیاز داریم که دقیقا مساوی بودن یا نبودن دو طرف رابطه را بررسی کنیم (از هر لحاظ)، بدین منظور از === استفاده می کنیم:

کد:
[/SIZE]
age === 12[SIZE=3]

بر اساس مقایسه === عبارت بالا درست خواهد بود ولی مقایسه به صورت زیر، نتیجه ی غلط خواهد داشت، چرا که ما 12 را به صورت عددی تعریف کردیم نه به صورت داده رشته ای (متنی):

کد:
[/SIZE]
age === "12"[SIZE=3]

و به همین ترتیب برای بررسی کوچکتر بودن از علامت >:

کد:
[/SIZE]
age < 12[SIZE=3]

معنی رابطه بالا: متغیر age کوچکتر از 12
برای بررسی بزرگتر بودن از علامت <:

کد:
[/SIZE]
age > 12[SIZE=3]

برای مقایسه کوچکتر یا مساوی بودن از علامت =>:

کد:
[/SIZE]
age <= 12[SIZE=3]

برای مقایسه بزرگتر یا مساوی بودن از علامت =<:

کد:
[/SIZE]
age >= 12[SIZE=3]

همچنین برای مقایسه چندگانه از علامت های && (و)، || (یا) و ! (نباشد) استفاده می کنیم:

کد:
[/SIZE]
age > 12 && age < 20[SIZE=3]
عبارت بالا یعنی اگر متغیر age بزرگتر از 12 و در عین حال کوچکتر از 20 باشد.
 

sky boy

متخصص بخش برنامه نویسی
(JavaScript If,Else Statements) شرط if و else در جاوا اسکریپت:

تا اینجا با علائم مقایسه آشنا شدیم، اما این علائم معمولا به خودی خود کار خاصی انجام نمی دهند و به نوعی تنها جمله خبری هستند
(سن مساوی 12 است، سن کوچکتر از 13 است و...)
برای اینکه بتوانیم مقایسه کامل تر و همراه با دستور یا فرمان را انجام دهیم، باید از if (اگر) و else (در غیر اینصورت) استفاده کنیم
مثلا بگوییم اگر سن برابر 12 بود، آنوقت فلان کار را انجام بده و اگر نبود، کاری دیگر را انجام بده؛
به مثال های زیر توجه کنید تا با نحوه عملکرد آنها بیشتر آشنا شوید:

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>دستورات شرطی و مقایسه ای در جاوا اسکریپت</title>
<style type="text/css">
body{
    direction:rtl;
    font-family:Tahoma, Geneva, sans-serif;
    font-size:12px;
}
</style>
<script type="text/javascript">
//<![CDATA[
var name = 'گرامی';
var age = 15;
var domain = 'webgoo.ir';
var otherdomain = 'yourdomain.com';

if (age > 12 && age < 20){
    document.write("کاربر گرامی سن شما بالاتر از 12 سال است!");
}
else {
    document.write("کاربر گرامی سن شما پائین تر از 12 سال است!");    
}
document.write("<br />");
document.write("<br />");
if (name != 'ناشناس' || domain == 'webgoo.ir'){
    document.write('کاربر '+ name + ' به سایت' + domain + ' خوش آمدید!');        
}
else{
    document.write('کاربر '+ name + ' به سایت' + otherdomain + ' خوش آمدید!');    
}
//]]>
</script>
</head>
<body>
<hr />
 متغیرها و مقادیر به کار رفته در این مثال فرضی هستند.
</body>
</html>

توضیح:
- در مثال ساده بالا، چند متغیر فرضی تعریف کرده ایم و محاسباتی جهت نمونه انجام داده ایم.
- در بخش دوم کد، ما از تکنیکی ترکیبی برای خروجی گرفتن همزمان متن و متغیر در یک دستور document.write استفاده کرده ایم.
- برای پی بردن به نحوه عملکرد شرط و مقایسه در جاوا اسکریپت، کد بالا را در سیستم خود و در یک صفحه با فرمت html ذخیره و به دلخواه تغییر دهید تا نتیجه تغییرات را ببینید.

 

sky boy

متخصص بخش برنامه نویسی
قبل از خاتمه بحث، یک نکته ناگفته:ترکیب دیگری از if و else به نام else if
گفتیم که if شرطی به معنی اگر و else جانشین آن و به معنی در غیر اینصورت است،مابین این دو، دستور else if را می توان گنجاند،پس به صورت ساده می شود:
اگر رابطه 1 نشد (if)، در غیر اینصورت اگر رابطه 2 نشد (else if)، اگر هیچ کدام از موارد قبلی نشد بخش سوم (else) اجرا شود؛
مثال زیر گویا است:
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>دستور شرطی و مقایسه ای else if در جاوا اسکریپت</title>
<style type="text/css">
body{
    direction:rtl;
    font-family:Tahoma, Geneva, sans-serif;
    font-size:12px;
}
</style>
<script type="text/javascript">
//<![CDATA[
var age = 25;
if (age == 12 || age == 20){
    document.write("کاربر گرامی سن شما 12 یا 20 سال است!");
}
else if(age != 12 && age != 20) {
    document.write("کاربر گرامی سن شما 12 یا 20 سال نیست!");    
}
else{
    document.write('کاربر گرامی سن شما' + age + 'سال است!');        
}
//]]>
</script>
</head>
<body>
<hr />
 متغیرها و مقادیر آنها در این مثال، از قبل تعریف شده اند.
</body>
</html>
نکته:
دقت کنید که شیوه نگارش جاوا اسکریپت با زبان های دیگر در موارد مشابه مثل php، کمی متفاوت است،
مثلا در php دستور else if را به صورت بدون فاصله و elseif نیز می نویسند.
 
بالا