|آموزش طراحی سایت|دستورات if .. else در جاوا اسکریپت|
امروز با پست جدیدی از سری پست های آموزش طراحی سایت همراه شما هستیم. در این پست دستورات if .. else در جاوا اسکریپت را مورد بررسی قرار می دهیم.
دستورات شرطی را به منظور انجام عملیات خاص در صورت برقرار بودن شرایط معین بکار می بریم، بدین معنا که در صورت درست بودن شرط معین دستورات و عملیات معینی اجرا شود.
دستورات شرطی (conditional statements)
گاهی اوقات به هنگام نوشتن یک اسکریپت یا کد، برنامه نویس نیاز دارد که تصمیم های متفاوتی با توجه به نتایج مختلف بگیرد، برای نیل به این هدف برنامه نویس از دستورات شرطی کمک می گیرد.
دستورات شرطی زبان جاوا اسکریپت به شرح زیر می باشد.
دستور if - از اين ساختار در مواقعی که می خواهيم در صورت بر قرار بودن شرط معینی دستور مشخصی اجرا شود، استفاده می کنیم . چنانچه شرط تعیین شده صحیح یا برقرار نبود، هيچ دستوری اجرا نخواهد شد.
دستور else - از اين ساختار زمانی استفاده می کنیم که می خواهيم در صورت بر قرار بودن شرط، دستور معینی اجرا شود و در صورت عدم بر قراری آن شرط، دستور یا مجموعه ای از دستورات دیگر اجرا گردند.
دستور else if : اگر شرط درست باشد دستور مقابل if اجرا می شود در غیر این صورت دستور مقابل else اجرا می گردد (در صورت غلط بودن شرط اول، شرط دیگری را برای امتحان کردن مشخص می کند).
دستور Switch : برای گزینش و اجرای یک دستور از میان چندین دستور مختلف بکار می رود.
دستور شرطی if
از اين ساختار در مواقعی که می خواهيم در صورت بر قرار بودن شرط معینی دستور مشخصی اجرا شود، استفاده می کنیم. چنانچه شرط تعیین شده صحیح یا برقرار نبود، هيچ دستوری اجرا نخواهد شد.
آموزش طراحی سایت دستور نگارش (syntax)
نکته:
توجه داشته باشید که دستور شرطی if با حروف کوچک نوشته می شود. نوشتن آن با حروف بزرگ If یا IF باعث ایجاد خطا می شود.
مثال:
در صورتی که زمان هنوز مرز ساعت 18:00 را رد نکرده، رشته ی "Good day" را نشان بده.
if (hour < 18)
{
greeting = "Good day"
}
نمونه یک
if (new Date().getHours() < 18) {
document.getElementById("demo") = "Good day!"
}
امتحان کنید:
<body>
<p>Display "Good day!" if the hour is less than 18:00:</p>
<p id="demo">Good Evening!</p>
if (new Date().getHours() < 18) {
document.getElementById("demo") = "Good day!"
}
</body>
دستور شرطی else
از اين ساختار زمانی استفاده می کنیم که می خواهيم در صورت بر قرار بودن شرط، دستور معینی اجرا شود و در صورت عدم بر قراری آن شرط، دستور یا مجموعه ای از دستورات دیگر اجرا گردند.
دستور if (شرط) {
قطعه کدی که در صورت برقرار بودن شرط باید اجرا گردد
دستور } else {
قطعه کدی که در صورت غلط یا برقرار نبودن شرط اول اجرا می گردد
{
اگر زمان از مرز ساعت 18 نگذشته، رشته ی "Good day" را نشان بده و در غیر این صورت "Good evening" را
if (hour < 18) {
greeting = "Good day"
} else {
greeting = "Good evening"
}
نتیجه:
نمونه دو
function myFunction() {
var hour = new Date().getHours();
var greeting;
if (hour < 18) {
greeting = "Good day"
} else {
greeting = "Good evening"
}
document.getElementById("demo") = greeting;
}
امتحان کنید:
<body>
<p>Click the button to display a time-based greeting:</p>
<button type="Button" ="myFunction()">Try it</button>
<p id="demo"></p>
function myFunction() {
var hour = new Date().getHours();
var greeting;
if (hour < 18) {
greeting = "Good day"
} else {
greeting = "Good evening"
}
document.getElementById("demo") = greeting;
}
</body>
دستور شرطی else if
اگر شرط درست باشد دستور مقابل if اجرا می شود در غیر این صورت دستور مقابل else اجرا می گردد (در صورت غلط بودن شرط اول، شرط دیگری را برای امتحان کردن مشخص می کند).
دستور نگارش
دستور if (شرط اول) {
قطه کدی که در صورت صحیح بودن شرط اول باید اجرا گردد
دستور } else if (شرط دوم) {
قطعه کدی که در صورت غلط بودن شرط اول و صحیح بودن شرط دوم باید اجرا شود
دستور } else {
قطعه کدی که در صورت غلط بودن هر دو شرط اول و دوم باید اجرا شود
}
مثال:
در صورتی که زمان حاضر مرز ساعت 10:00 را پشت سر نگذاشته، رشته ی "Good morning" نمایش داده می شود و چنانچه زمان از ساعت 20:00 عبور نکرده رشته ی "Good day" و در غیر این صورت نیز "Good evening".
if (time < 10) {
greeting = "Good morning"
} else if (time < 20) {
greeting = "Good day"
} else {
greeting = "Good evening"
}
نتیجه:
نمونه سه
function myFunction() {
var greeting;
var time = new Date().getHours();
if (time < 10) {
greeting = "Good morning"
} else if (time < 20) {
greeting = "Good day"
} else {
greeting = "Good evening"
}
document.getElementById("demo") = greeting;
}
امتحان کنید:
<body>
<p>Click the button to get a time-based greeting:</p>
<button type="Button" ="myFunction()">Try it</button>
<p id="demo"></p>
function myFunction() {
var greeting;
var time = new Date().getHours();
if (time < 10) {
greeting = "Good morning"
} else if (time < 20) {
greeting = "Good day"
} else {
greeting = "Good evening"
}
document.getElementById("demo") = greeting;
}
مطلبی دیگر از این انتشارات
چک کردن وضعیت اینترنت کاربر در جاوا اسکریپت
مطلبی دیگر از این انتشارات
هرچیزی که درمورد bind و this در JavaScript و React باید بدونیم!
مطلبی دیگر از این انتشارات
آموزش طراحی سایت-کار با تاریخ در جاوا اسکریپت