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

جاوا اسکریپت (که با عنوان JS نیز شناخته می شود) یک زبان برنامه نویسی سطح بالا می باشد که قواعد دستوری آن شبیه به C, C++, C# و جاوا بوده و در کنار html و css یکی از عناصر ضروری هر وبسایت می باشد. هدف اصلی از ارائه جاوا اسکریپت پوشش ضعف های html و css می باشد.

قواعد دستوری (Syntax)

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

  1. جاوا اسکریپت Case Sensitive (حساس به حروف کوچک و بزرگ) می باشد برای مثال اگر متغیری با نام number تعریف کرده باشید نمی توانید از آن به شکل Number استفاده نمایید.
  2. در جاوا اسکریپت متغیرها نوع ندارند.
  3. در انتهای هر جمله می بایست از علامت ; استفاده شود، هرچند این کار ضروری نمی باشد اما پیشنهاد می شود، همیشه از آن تبعیت کنید.
  4. دستورات هر بلاک برنامه نویسی می بایست بین علامت { } قرار گیرد.
  5. ساختارهایی مانند if و for که خود دارای بدنه می باشند نباید در انتهای آنها از علامت ; استفاده شود.

کامنت ها

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

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

کامنت تک خطی

در این روش توضیحات مورد نظر بعد از علامت های // قرار می گیرند.

//single line comment

کامنت چند خطی

در این روش ابتدا و انتهای کامنت با علامت های */ و /*  مشخص می گردد.

/*
This is
multiple line
comment
*/

نکته: کامنت هامی تواند به زبان دلخواه (فارسی، لاتین و ...) مورد استفاده قرار گیرند.

یکی دیگر از موارد استفاده کامنت ها، غیر فعال کردن موقت یک دستور یا یک قطعه کد می باشد.

/*
function test(){
    alert('this is for test');
}
*/

اجرای اولین برنامه

برای شروع برنامه نویسی با جاوا اسکریپت می توانید از Code Editorهای مختلفی استفاده نمایید که پیشنهاد ما استفاده از Visual Studio Code می باشد که می توانید راهنمای دانلود و نصب آن را در این صفحه مشاهده نمایید.

پس از دانلود و نصب برنامه در محلی که قصد دارید پروژه خود را ایجاد نمایید (مثلا Desktop) یک پوشه بسازید.

آموزش جاوا اسکریپت - ساخت پوشه پروژه

سپس برنامه Visual Studio Code را اجرا کرده و از منوی File گزینه Open Foler را انتخاب کنید.

در پنجره باز شده، پوشه ایجاد شده (پوشه پروژه) در مرحله اول را انتخاب کنید تا محتوای آن در برنامه نمایش داده شود.

آموزش جاوا اسکریپت-انتخاب پوشه پروژه

برای تست اولین برنامه جاوا اسکریپت می بایست یک صفحه HTML ایجاد کنید. برای ایجاد فایل جدید روی گزینه New File کلیک کنید.

آموزش جاوا اسکریپت - ساخت فایل

نام آن را index.html بگذارید.

آموزش جاوا اسکریپت - ساخت فایل Html

دقت کنید که حتما پسوند html. برای فایل تعیین گردد. سپس دستورات زیر را درون فایل ایجاد شده نوشته و با فشردن کلیدهای CTRL + S فایل را ذخیره کنید.

<!DOCTYPE html>
<html>
    <head>
        <title>Beno Academy | Javascript Tutorial</title>
    </head>
    <body>
        <script>
            alert('ok');
        </script>
    </body>
</html> 

برای اجرای صفحه، می بایست افزونه Open in browser را در Visual Stuio Code نصب کنید. بدین منظور روی گزینه Extensions کلیک کنید.

آموزش جاوا اسکریپت-نصب افزونه

در کادر جستجوی پنجره باز شده عبارت open in browser را تایپ کنید.

نصب افزونه open in browser

در بین افزونه های نمایش داده شده گزینه open in browser را انتخاب کرده و روی دکمه Install کلیک کنید. پس از نصب، پنجره مربوط به نصب Extension را بسته و  روی گزینه Explorer کلیک کنید تا مجددا فایل های پروژه نمایش داده شوند.

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

همانند تصویر فوق روی فایل index.html کلیک کرده و گزینه Open in default browser را انتخاب کنید.

اجرای اولین پروژه جاوا اسکریپت - نمایش پیغام

در صورتیکه مراحل فوق را به درستی انجام داده باشید، پیغام ok نمایش داده می شود.