19
تشکر

آموزش زبان جاوا اسکریپت – بخش اول

JavaScript - جاوا اسکریپت

JavaScript – جاوا اسکریپت

در این دوره قرار است به آموزش زبان جاوا اسکریپت بپردازیم. در حال حاظر با ورود HTML5 به دنیای تحت وب و فراگیر شدن آن, یاد گرفتن زبان JavaScript یکی از نیازهای مهم هر توسعه دهنده وب است.

پیش نیازها: آشنایی حداقلی با یک زبان برنامه نویسی دیگر و دستورات کلی آن مانند if, for و …

امیدوارم این دوره, نیازهای اولیه ما را برطرف کند و به صورت کلی با زبان JavaScript آشنا شویم.

در ادامه با ما همراه باشید…

تاریخچه و اطلاعات این زبان را در این مطلب نمینویسم زیرا در اینترنت منابع زیادی در این رابطه وجود دارد. در ابتدا به صورت پایه ای با این زبان آشنا میشویم.

برای اینکه بتوانیم کدهای JavaScript را درون یک صفحه اجرا کنیم باید داخل صفحه HTML خودمان یک تگ به نام script باز کنیم و خصوصیت type آن را برابر text/javascript قرار دهیم.

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8" />
	<title>JavaScript</title>
  <script type="text/javascript">
  
  </script>
</head>
<body>
	
</body>
</html>

الان میتوانیم داخل تگ script کدهای JavaScript را قرار دهیم.

 در ابتدا با دستور console.log آشنا میشویم. با استفاده از این دستور میتوانیم مقادیر متغیرها را درون Console مروگر نمایش دهیم که برای خطایابی ابزار بسیار خوبی است. برای مثال دستور زیر را بنویسید و صفحه را در مرورگر اجرا کنید.

console.log("Your name");

برای نمایش Console مروگر باید به قسمت Web Developer مرورگر مراجعه کنید. در گوگل کروم این قسمت با زدن کلید F12 و رفتن به تب آخر نمایش داده میشود. در مروگرهای دیگر هم تقریبا مشابه است. خروجی Console من برابر زیر شد.

JavaScript - جاوا اسکریپت

JavaScript – جاوا اسکریپت

من میتوانم ابتدا نام خودم را درون یک متغیر قرار دهم سپس آن را برای نمایش به Console بفرستم. بدین صورت:

var myName = "Your name";
console.log(myName);

میبینید که خروجی Console مانند قبل است.

میتوان تعداد کاراکتر های درون متغیر را با متد length بدست آورد. این متد برای گرفتن تعداد خانه های یک آرایه هم کاربرد دارد. برای نمایش تعداد کاراکتر های درون متغیر بدین صورت عمل میکنیم.

var myName = "Your name";
console.log(myName.length);

بدین صورت تعداد کاراکترهای درون متغیر myName نمایش داده میشود که برای من عدد 6 را نمایش داد.

به جای اینکه محتوای متغیرها یا هر چیز دیگری را درون قسمت Console مروگر نمایش دهیم میتوانیم به صورت یک پیغام درون خود صفحه نیز نمایش دهیم. برای اینکار میتوانیم به جای دستور console.log از دستور alert استفاده کنیم.

var myName = "Your name";
alert(myName.length);
JavaScript - جاوا اسکریپت

JavaScript – جاوا اسکریپت

همانطور که میبینید این پیغام فقط دارای یک دکمه OK است. اما JavaScript یک زبان تعاملی است. برای مثال میتوان یک سوال از کاربر پرسید که دارای دو دکمه OK و Cancel است که کاربر در آن حق انتخاب دارد. برای این کار از دستور confirm استفاده میکنیم. برای مثال کد زیر را ببینید.

var Q1 = "Do you like JavaScript language?";
var answer = confirm(Q1);
console.log(answer);

در خط اول سوالی که میخواهیم از کاربر بپرسیم را درون یک متغیر قرار دادیم و در خط دوم توسط دستور confirm این سوال را از کاربر پرسیدیم و خروجی این دستور را درون متغیر answer قرار دادیم. در خط سوم خروجی دستور confirm که درون متغیر answer ریختیم را درون Console نمایش میدهیم.

اگر کاربر بر روی دکمه OK کلیک کند درون Console مقدار true و در غیر اینصورت مقدار false نمایش داده میشود.

اما اگر بخواهیم از کاربر یک مقدار دریافت کنیم چه کار باید بکنیم. برای مثال میخواهیم اسم کاربر را بپرسیم. چگونه باید این کار را انجام داد.

توسط دستور prompt میتوان یک مقدار از کاربر گرفت. برای مثال:

var answer = prompt("What is your name?");
console.log(answer);

اگر توجه کرده باشید در حال حاظر با سه نوع داده در JavaScript آشنا شدیم. numbers یا اعداد, string یا رشته  و  booleans.

حالا میخواهیم با عملگر های مقایسه ای آشنا شویم. عملگرهای مقایسه ای همان عملگرهای ریاضی هستند مانند بزرگتر, بزرگتر مساوی, کوچکتر, کوچکتر مساوی, مساوی, نا مساوی

این عملگر ها در بیشتر زبان ها یکسان هستند اما عملگر مساوی و نا مساوی برخلاف دیگر زبان ها در JavaScript کمی فرق میکند. برای مثال عملگر مساوی به صورت ===  و عملگر نا مساوی به صورت !== استفاده میشود.

برای مثال کدهای زیر را اجرا کنید و نتیجه را در Console ببینید.


console.log(15 > 4);
console.log(“Hello”.length < 122); console.log("what is your name?".length > 8);
console.log(8*2 === 16);
console.log(8*2 !== 16);
console.log(“JavaScript”.length < 2); [/javascript]

همانطور که میبینید دو دستور آخر مقدار false را برمیگردانند و بقیه true.

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

 در بخش بعدی بیشتر با رشته ها و متغیرها کار خواهیم کرد.

ادامه دارد…

 

  • سلام ممنون از مطالب خوبتون عالی بود.

  • رضا می‌گه:

    سلام داش محسن
    لطفا قسمت 2 این مطلب رو بزارید
    ممنون

  • Mohammad می‌گه:

    ….
    اینا 1% ملزومات جاوا اسکریپت هم نبود

    برید اینجا اون وقت میفهمید ملزونات جاوا اسکریپت یعنی چی

    http://www.w3schools.com

    • محسن شفیعی می‌گه:

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


  • نظرات این مطلب بسته است.