آموزش جاوا اسکریپت – قسمت 2

16 بهمن ۱۴۰۰

آموزش جاوا اسکریپت – قسمت 2

 

در جلسه دوم از آموزش جاوا اسکریپت قصد داریم کمی بیشتر مباحث اولیه این زبان برنامه‌نویسی را ادامه دهیم. در ابتدا باید وارد صفحه ویژوال استودیو کد شویم. دقت داشته باشید که در دوره آموزش جاوا اسکریپت رایگان بهتر است که از برخی از افزونه‌های ویژوال استودیو کد استفاده کنید که کدنویسی به زبان جاوا اسکریپت را برای شما ساده‌تر می‌کند. یکی از این افزونه‌ها افزونه Live server است که حتما باید آن را نصب کنید. این افزونه به شما کمک می‌کند تا بتوانید کدهای خود را به‌صورت زنده در ویژوال استودیو کد تغییر داده و نتیجه آن را مشاهده کنید. با ایجاد تغییرات و ذخیره‌کردن کدها نتیجه آنها برای شما نشان داده می‌شود. افزونه دیگری که ما در آموزش جاوا اسکریپت به زبان ساده به آن نیاز داریم افزونه ESLint است که کدهای ما را مرتب کرده و ایرادات سینتکسی ما را نیز نمایش می‌دهد. این افزونه به شما کمک می‌کند تا کدهای خود را به شکل مرتب‌تری بنویسید و در نوشتن کدهای جاوا اسکریپت بسیار کمک‌کننده است.

افزونه دیگری که به شما پیشنهاد می‌کنیم حتما آن را نصب کنید افزونه Prettier می‌باشد. این افزونه نیز ساختار کدهای شما را تنظیم کرده و آنها را مرتب می‌کند.

 

عبارت‌ها در جاوا اسکریپت

عبارت‌ها در جاوا اسکریپت

آشنایی با مفهوم عبارت‌ها در زبان برنامه‌نویسی جاوا اسکریپت

دستوری که در یک صفحه جاوا اسکریپت نوشته شود و سپس با استفاده از ; به اتمام برسد به آن دستور عبارت گفته می‌شود؛ بنابراین هر کدی که شما می‌نویسید و کدهای خود را با ; به اتمام می‌رسانید آن کد به عبارت تبدیل می‌شود. حال ممکن است این سوال پیش بیاید که چرا ما در کدهای خود “ ; “ می‌گذاریم؟ دلیل این موضوع این است که زمانی که کدهای جاوا اسکریپت در حال پردازش در سیستم هستند پردازشگر باید متوجه شود که یک دستور به اتمام رسیده است و باید آن را به چشم یک عبارت ببیند؛ بنابراین ; در واقع نشان‌دهنده تمام شدن یک قطعه کد جاوا اسکریپت است. اگر با عبارت‌های نظامی که معمولا در فیلم‌ها نیز نشان داده می‌شوند آشنایی داشته باشید حتما مشاهده کرده‌اید که پس از گفتن یک جمله در داخل بی‌سیم عبارت " تمام" گفته می‌شود.

در برنامه‌نویسی به زبان جاوا اسکریپت نیز ; نشان‌دهنده اتمام یک دستور است؛ بنابراین در آموزش جاوا اسکریپت حتما باید به این نکته دقت داشته باشید که پس از هر دستور حتما یک ; بگذارید.

 

متغیرها در جاوا اسکریپت

متغیرها در جاوا اسکریپت

آموزش کار با متغیرها در زبان برنامه‌نویسی جاوا اسکریپت

در بخش دیگر آموزش جاوا اسکریپت قصد داریم کمی بیشتر درباره متغیرهای این زبان برنامه‌نویسی صحبت کنیم. اگر با زبان‌های برنامه‌نویسی دیگر کارکرده باشید حتما مشاهده کرده‌اید که در این زبان‌ها متغیرها دارای انواع مختلفی از جمله string، int و ... هستند. در واقع شما باید متغیرها را با استفاده از نوع آنها تعریف کنید. در آموزش javascript این‌چنین نیست و تعریف متغیرها بسیار ساده‌تر است. پیش‌ازاین که درباره تعریف متغیرها صحبت کنیم اجازه دهید تا به بررسی این موضوع بپردازیم که اصلا متغیر چیست؟ زمانی که شما قصد دارید یک مقدار را در کدهای خود تعریف کنید (به‌عنوان‌مثال یک نام، شماره و ...) باید برای آن یک متغیر را در نظر بگیرید که این متغیر در داخل رم یک فضای مخصوص به آن مقدار را اشغال می‌کند و به شما اجازه می‌دهد تا بعدها به این بخش از حافظه رم دسترسی پیدا کنید.

در آموزش javascript رایگان حتما به این نکته دقت داشته باشید که ما انواع متغیرها را در این زبان برنامه‌نویسی داریم ولی در زمان استفاده از آنها نیازی نیست که به نوع آنها اشاره کنیم. برای استفاده از متغیرها کافی است که از کلید واژه var استفاده کنیم. دقت داشته باشید که var شروع‌کننده کلمه variable می‌باشد. به‌عنوان‌مثال قطعه کد زیر را در نظر بگیرید:

 

var number;

var name;

number = 1;

name = “ mohammad”;

 

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

 

var number, name;

number = 1;

name = “mohammad”;

 

فاصله

فاصله در جاوا اسکریپت

نکاتی درباره فاصله‌ها در زبان برنامه‌نویسی جاوا اسکریپت

یکی از نکات بسیار مهمی که در آموزش جاوا اسکریپت باید به آن دقت داشته باشید این است که space یا فاصله در سینتکس جاوا اسکریپت اهمیت چندانی ندارد. در واقع شما هرچه فاصله بین کدهای خود قرار دهید تفاوتی در کدهای شما ایجاد نمی‌شود و به همان شکل استاندارد خود اجرا خواهد شد. البته باید دقت داشته باشید که این مسئله در رشته‌ها صادق نیست و به‌عنوان‌مثال رشته “mohammad” با رشته “m o h a m m a d” متفاوت است و در این‌جا فاصله‌ها به رسمیت شناخته می‌شوند. قطعه کد زیر را در نظر بگیرید:

 

var name = “m o h a m m a d”;

console.log(name);

 

حال برای این‌که از افزونه لایو سرور استفاده کنید کافی است که وارد صفحه html خود شده و در این صفحه راست کلیک کنید. از میان گزینه‌های ظاهر شده باید گزینه open with live server را انتخاب کنید. با این کار پنجره‌ای برای شما باز می‌شود که صفحه خروجی را به طور کامل به شما نمایش می‌دهد. در این صفحه راست کلیک کرده و گزینه inspect را انتخاب کنید. در صفحه‌ای که باز می‌شود وارد تب کنسول شوید. حال می‌توانید مقدار این متغیر که لاگ شده است را مشاهده کنید و می‌بینید که فاصله‌ها نیز دقیقا به همان ترتیبی که در قطعه کد بالا بیان کردیم نمایش داده شده‌اند.

 

نمایش داده‌ها

نمایش داده‌ها

روش‌های نمایش داده‌ها و متغیرها در مرورگر

بخش بعدی آموزش جاوا اسکریپت را به روش‌های نمایش داده‌ها و متغیرها اختصاص خواهیم داد. یکی از روش‌هایی که امروزه برای انجام این کار وجود دارد و در بخش قبلی نیز آن را به شما نمایش دادیم روش console.log است که بیشتر توسعه دهندگان از این روش استفاده می‌کنند. بااین‌حال روش‌های دیگری نیز برای این کار وجود دارد که بهتر است با آنها نیز آشنا شوید. از دیگر روش‌های مخصوص چاپ داده می‌توان به دستور document.write() اشاره کرد. در داخل پرانتز این دستور شما باید متغیری که قصد چاپ‌کردن داده آن را دارید وارد کنید. به‌این‌ترتیب این مقدار به شما نمایش داده می‌شود. دقت داشته باشید که در این روش مقداری که شما آن را چاپ کرده‌اید در صفحه html شما نمایش داده می‌شود.

یک روش رایج دیگر برای نشان‌دادن متغیرها در زبان برنامه‌نویسی جاوا اسکریپت که قصد داریم در این بخش از آموزش جاوا اسکریپت پروژه محور آن را معرفی کنیم استفاده از دستور windows.alert() است که در داخل پرانتز آن متغیری که قصد چاپ کردن آن را دارید قرار می‌گیرد. این دستور یک پاپ‌آپ را به شما نمایش می‌دهد که مقدار متغیر در داخل آن چاپ شده است.

 

کامنت‌گذاری

کامنت‌گذاری

کامنت‌گذاری در زبان برنامه‌نویسی جاوا اسکریپت

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

 

کامنت‌گذاری

کدنویسی

کدنویسی منطقی در زبان برنامه‌نویسی جاوا اسکریپت

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

 

var a, b, c;

a = 12;

b = 8;

c = a + b;

document.write( c );

 

 

با ذخیره‌کردن این کد مشاهده می‌کنید که نتیجه این جمع ساده یعنی عدد 20 در خروجی شما چاپ می‌شود. سایر عملیات‌های ریاضی مانند تفریق، ضرب و تقسیم نیز به همین سادگی قابل انجام هستند که شما می‌توانید به‌عنوان تمرین آنها را انجام دهید. تنها نکته‌ای که باید به آن دقت داشته باشید این است که برای ضرب کردن دو متغیر باید از کاراکتر * و برای تقسیم نیز از / استفاده کنید. یکی دیگر از عملگرهایی که باید با آن در زبان برنامه‌نویسی جاوا اسکریپت آشنا شوید عملگر % است. این عملگر در واقع باقی‌مانده تقسیم را برای شما برمی‌گرداند. به‌عنوان‌مثال قطعه کد زیر را در نظر بگیرید:

 

var a, b, c;

a = 12;

b = 8;

c = a % b;

document.write( c );

 

خروجی این کد 4 خواهد بود که نشان‌دهنده باقی‌مانده تقسیم a بر b است. در این زبان برنامه‌نویسی عملگرهای پیچیده‌تری نیز وجود دارند که در ادامه آموزش جاوا اسکریپت بیشتر با آنها و کاربردی که در این زبان برنامه‌نویسی دارند آشنا خواهیم شد.

 

 


قسمت قبلی آموزش رایگان جاوا اسکریپت:

آشنایی با ساخت پروژه ها vscode

ساخت فایل های جاوا اسکریپت


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

آشنایی با انواع داده ها

آشنایی با آبجکت ها و اشیا


یا جهت مشاهده ویدیوهای اموزشی آموزش رایگان جاوا اسکریپت وارد این صفحه شوید.

محبوب ترین مقالات