چرا شرط؟

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

 میخوام بگم توی دنیای واقعی از این اگر ها زیاد داریم و توی دنیای برنامه نویسی هم این اگرها وجود داره. مثلا اگر کاربر ساعت 6 صبح تا 12 ظهر وارد سایت من شد من میخوام اون بالا تو سایتم بنویسه صبج بخیر، یا اگر توی سایتم یه آزمونی درست کردم که جواب سوال 1 گزینه 3 بود و کاربر گزینه 2 رو انتخاب کرد بهش بگم جوابت اشتباه بود و کلی مثال این مدلی میشه زد که با این اگر ها سر و کار داریم. این اگرها رو توی برنامه نویسی با if  و else پیاده سازی میکنیم که توی این آموزش میخوام در موردشون صحبت کنم.

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

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

اگر بخوام به صورت گرافیکی ساختار شرط رو به شما نشون بدم میتونم اینجوری بهتون بگم که هر شرطی در برنامه نویسی دو حالت داره، یا درسته یا غلطه و بر اساس درست بودن یا غلط بودن یک شرط یه سری دستورات مشخص کنیم. مثلا تو این عکس داریم اینجوری نشون میدیم که اگر شرط من درست بود دستورات 1 رو انجام بده واگر غلط بود دستورات 2 رو انجام بده:

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

برای اینکه یک شرط رو بتونیم بیان کنیم نیاز به یه سری عملگر داریم. که احتمالا با بیشتر این عملگرها آشنایی دارید. عملگرهایی که ما داریم اینا هستند: کوچکتر، بزرگتر، کوچکتر مساوی، بزرگتر مساوی، تساوی و عملگر مخالف. (در آموزش جلسه بعد در مورد عملگرها بیشتر صحبت میکنیم.)

حالا بریم و اولین کد این جلسه رو بنویسیم. در ادامه میخواهیم با هم مثال هوا رو ببریم جلو. پس یه متغیر به اسم hava تعریف میکنیم:

let hava = 'barani';

if(hava == 'barani'){
    console.log('ba khodet chatr bebar!')
} 

در کد بالا به ساختار دستور if دقت کنید. بعد از if و داخل پرانتز یک شرط نوشته شده. این شرط رو با یه مساوی ننوشتیم، با دو تا مساوی نوشتیم. حواستون باشه یه مساوی برای انتسابه. مثلا تو خط اول barani  رو تو متغیر hava ذخیره کردیم. پس یه مساوی گذاشتیم. ولی تو خط سوم میخواهیم مقدار متغیر hava رو با barani مقایسه کنیم. یعنی میخواهیم ببینیم این دو تا با هم برابرند یا نه. (پس از دو تا مساوی استفاده کردیم)
 این شرط دو حالت داره یا درسته یا غلط! اگر درست باشه دستوری که در داخل آکولاد باز و بسته براش مشخص کردیم اجرا میشه. اما اگر شرط غلط باشه چه اتفاقی میوفته؟ هیچ اتفاقی نمی افته! چرا؟ چون براش چیزی مشخص نکردیم. اگه قرار باشه برای درست بودن شرطمون دستورات 1 و برای غلط بودن شرطمون دستورات 2 اجرا بشه باید از else استفاده کنیم:

let hava = 'barani';

if(hava == 'barani'){
    console.log('ba khodet chatr bebar!')
}else{
    console.log('nemikhad chatr bebari!')
} 

پس یه بار دیگه کد بالا رو با هم تحلیل کنیم که خیالم راحت شه متوجه شدید:

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

if و else if

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

let hava = 'aftabi';

if(hava == 'barani'){
    console.log('ba khodet chatr bebar!')
}else if (hava == 'aftabi'){
    console.log('eynak aftabi bezan!')
}else if(hava == '2nafare'){
    console.log('be refighet zang bezan!')
} 

در کد بالا برای همه حالتهایی که در سوال مطرح کردیم شرطها رو قرار دادیم و دستورات رو براش نوشتیم. میتونید همین الان این کد رو در vscode بنویسید و امتحانش کنید. (مقادیر مختلف برای hava در خط اول بذارید.)

سوال: اگر مقدار hava رو برابر nimeAbri بذارید چه اتفاقی میوفته؟
جواب: هیچی! چون برای این وضعیت فکری نکردیم!
سوال: خب کاربر ممکنه ورودی های مختلفی وارد کنه: مثل نیمه ابری، طوفانی … و ممکنه ما به همه اینها فکر نکرده باشیم. چیکار کنیم که الگوریتممون بهتر کار کنه؟
جواب: خیلی ساده است! از else استفاده کن:

let hava = 'nimeAbri';

if(hava == 'barani'){
    console.log('ba khodet chatr bebar!')
}else if (hava == 'aftabi'){
    console.log('eynak aftabi bezan!')
}else if(hava == '2nafare'){
    console.log('be refighet zang bezan!')
}else{
    console.log('har kar doost dari anjam bede!')   
} 

سوال بعدی: اگر توی else if دوم جای 2nafare بنویسیم aftabi (یعنی دو تا else if داریم که aftabi بودن رو چک میکنن) به نظرتون خطا میده؟ اگه خطا میده چرا و اگه خطا نمیده خروجیش چی میشه:

let hava = 'aftabi';

if(hava == 'barani'){
    console.log('ba khodet chatr bebar!')
}else if (hava == 'aftabi'){
    console.log('eynak aftabi bezan!')
}else if(hava == 'aftabi'){
    console.log('be refighet zang bezan!')
}else{
    console.log('har kar doost dari anjam bede!')   
} 

جواب: قبل اینکه جواب رو ببینی حتما بهش فکر کن و تو ذهنت بگو خروجی چی میشه. جالا جواب:

توی خروجی اینو چاپ میکنه: eynak aftabi bezan چرا؟ نکته مهمی که وجود داره اینه که به همه دستوراتی که برای if نوشتیم میگیم یک بلاک if داریم. یعنی اون دو تا else if و else آخر رو با if اول به عنوان یک بلاک if میشناسیم. جاوا اسکریپت اینجوری کدها رو اجرا میکنه:
شرط اولی رو چک میکنه، آیا مقدار hava برابر barani است؟ تو این کد ما نه! پس میره سراغ شرط بعدی. آیا مقدار hava برابر aftabi هست؟ بله مقدار hava برابر aftabi است. پس چه اتفاقی می افته؟ دستورات مربوط به این شرط اجرا میشه، و وقتی همه دستورات اجرا شد کلا از بلاک if خارج میشه. این حرف به معنیه که اصلا else if بعدی چک نمیشه! و این نکته مهمیه!

switch case

شما میتونید بعضی از الگوریتمهایی که با if و else if مینویسید رو با switch case هم پیاده سازی کنید. چطوری؟ با مثال خودمون بریم جلو. در مثال بالایی شرط های ما روی مقدار hava نوشته شده بود. یعنی بر اساس اینکه  مقدار این متغیر چیه در خروجی پیام مرتبط رو چاپ میکردیم. اول کد سوال بالا رو با switch case ببینید و سعی کنید خودتون متوجهش بشید و بعد بیایید تا توضیحش رو بهتون بگم:

switch(hava){
    case 'barani':
        console.log('ba khodet chatr bebar!');
        break;

    case 'aftabi':
        console.log('eynak aftabi bezan!');
        break;

    case '2nafare':
       console.log('be refighet zang bezan!');
       break;
    
    default:
       console.log('har kar doost dari anjam bede!')
} 

در قالب چند تا نکته نکات switch case رو بهتون میگم:

1- متغیری که میخواهیم بررسیش کنیم رو جلوی switch مینویسیم. 
2- مقادیری که متغیر من میتونه داشته باشه رو در قالب case تعریفش میکنم. مثلا case اول رو دقت کنید. به این معنیه که اگر hava برابر barani بود دستورات بعد از case اجرا بشه
3- دستور break به معنی خارج شدن از بلاک switch است. مثلا break اول رو ببینید. کی این دستور اجرا میشه؟ وقتی که hava برابر barani باشه و بعد از اجرای دستور کنسول دستور break اجرا میشه و کلا از switch بیرون میاد. یه چیزی شبیه به همون آکولاد بسته تو if است.
4- دستور default چیه؟ همون کار else رو میکنه برای ما. بعنی اگه هیچکدوم از case ها برای متغیر hava صدق نکنه میره و دستورات دیفالت رو اجرا میکنه.

فرق if و switch؟

مهمترین و بزرگترین تفاوتشون در اینه:

با switch case فقط شرطهای تساوی رو میتونید پیاده سازی کنید. مثلا برای مثال بالا مقدار hava رو با چند تا مقدار میخواستیم مقایسه کنیم و ببینیم مساوی هستن یا نه. درسته؟ اما این مثال رو در نظر بگیرید:

ساعت فعلی سیستم رو چک کن اگه ساعت بین 6 تا 12 بود تو به کاربر صبح بخیر بگو! اینجا باید چک کنیم که مثلا متغیر hour (که ساعت رو نشون میده) بین 6 تا است یا نه که باید با عملگر بزرگتر و گوچکتر اینکار رو کنیم (یعنی بگیم hour>6 && hour<12 ) 
آیا مساله بالا رو میشه با switch حل کرد؟ نه (البته با ترفندی میشه حل کرد ولی اصلا جالب نیست) چون که ما  تو شرطمون به علامت بزرگتر و کوچکتر نیاز داریم که از عهده switch خارجه!

پس میشه بگیم if از switch بهتره؟

برای جواب به این سوال اینو در نظر داشته باشید که با switch case میشه کد خواناتری نوشت (شاید) یعنی اینکه در شرایطی که ما یه مساله مثل مثال آب و هوا بخواهیم حل کنیم کد switch میتونه خواناتر از if else باشه. البته بازم میگم شاید! یعنی من خودم ترجیحم اینه که بیشتر از if استفاده کنم. ممکنه شما با switch ارتباط بیشتری برقرار کنید و ترجیختون switch case باشه 🙂

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

1- فرض کنید ضرایب یک معادله درجه دو را در متغیرهای a، b و c ذخیره کردید. برنامه ای بنویسید که مشخص  کند این معادله چند ریشه دارد.
(راهنمایی: شما باید ابتدا دلتا را محاسبه کنید و سپس از مثبت بودن، منفی بودن و یا صفر بودن دلتا نتیجه بگیرید این معادله چند ریشه دارد) میتوانید ویدیو حل این مساله با فلوچارتها را در این لینک ببینید:

 

2- فرض کنید ساعت فعلی سیستم رو در متغیری به اسم hour به صورت دستی ذخیره میکنیم. برنامه ای بنویسید که بر اساس مقدار متغیر در خروجی صبح بخیر، ظهر بخیر، عصر بخیر و یا شب بخیر چاپ کند.
(راهنمایی: برای این مساله به ترکیب شرطها نیاز دارید که در جلسه بعدی آموزش میدم ولی فعلا این شرط رو از من داشته باشید که بتونید کدش رو بنویسید: hour>6 && hour<12 یعنی ساعت بین 6 تا 12 باشه)

3- برای مساله قبلی هوشمندتر عمل کنید! یعنی ساعت سیستم رو با استفاده از توابع جاوا اسکریپت پیدا کنید. (راهنمایی: در گوگل سرچ کنید توابع مربوط به زمان در جاوا اسگریپت و ببینید چطور میشه به ساعت فعلی سیستم دسترسی پیدا کرد)

 

شما نهمین جلسه از آموزشهای رایگان جاواسکریپت من رو به پایان رسوندید. اگر دوست دارید میتونید همه آموزشهای رایگان من رو در سایت و یا یوتیوب از اینجا دنبال کنید:
دوره جامع جاوا اسکریپت

دوست داری وارد بازار کار بشی؟

من یک دوره آموزشی جامع جاوا اسکریپت آماده کردم که با شرکت در این دوره شما رو آماده ورود به بازار کار میکنم. مزیت این دوره پشتیبانی دائمی دوره است که من همراه شما خواهم بود که جاوا اسکریپت رو یاد بگیرید و قدم در راه ورود به بازار کار بردارید. پیشنهاد میکنم سرفصلهای دوره و پروژه هایی که در دوره پیاده سازی شده رو ببینید:

ممنون که تا اینجا همراه من بودید. اگر از آموزش این پست خوشتون اومد و یا سوالی داشتید حتما در قسمت نظرات با من درمیون بذارید. اگر هم به یوتیوب و یا اینستاگرام دسترسی دارید من رو در این دو پلتفرم دنبال کنید و با لایک ها و کامنتاتون به من انرژی بدید. در کانال تلگرام هم میتونید بیشتر با من در ارتباط باشید