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

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

می توانید کدهای جاوا اسکریپت خود را که در تگ <script> تعریف نموده اید، در هر جای صفحه وب مورد نظرتان قرار دهید، اما بهترین روش این است که آنها را در تگ ابتدای صفحه (تگ  <head> ) بگنجانی تگ <script> به مرورگر اعلام می کند که کلیه دستورات درون این تگ را به صورت مفسر خوانده و اجرا کند. بنابراین ساده ترین کد جاوا اسکریپت می تواند به صورت زیر در صفحه تعریف شود.

<script ...>
   JavaScript code
</script>

تگ Java Script دو خاصیت مهم زیر را می تواند داشته باشد.

  • Language : این خاصیت تعیین می کند که شما از چه زبان اسکریپتی برای نوشتن کدهای خود استفاده نموده اید که قاعدتا بایستی javascript باشد. به همین دلیل مرورگرهای جدید، از این خاصیت صرف نظر می کنند.
  • Type : این خاصیت نیز نوع دستورات تعیین شده در اسکریپت را تعیین می کرده که رایج ترین مقدار برای آن “ text/javascript “ می باشد. به معنای اینکه به زبان جاوا اسکریپت و به صورت متنی هستند.

بنابراین تگ Java Script شما در حالت کاملتر بایستی به صورت زیر باشد:

<script language="javascript" type="text/javascript">
   JavaScript code
</script>

 

نوشتن اولین قطعه کد جاوا اسکریپت

بیایید برای یادگیری و درک بهتر زبان جاوا اسکریپت، اولین قطعه کد خود را برای چاپ عبارت “ Hello World “ در خروجی بنویسیم. یک کد دلخواه به نام توضیح (comment) را اضافه کرده ایم که سایر دستورات را درون خود جای داده است. این کار برای جلوگیری از اجرای ناصحیح دستورات جاوا اسکریپت توسط ورژن های قدیمی مرورگرهایی است که از این زبان پشتیبانی نمی کنند.
در مرحله بعد، تابع document.wite  را فراخوانی کرده که می تواند متن یا کد HTML درون پرانتز مقابلش را بر روی صفحه چاپ می کند. بنابراین خروجی کد فوق به صورت زیر است.

<html>
   <body>
      <script language="javascript" type="text/javascript">
         <!--
            document.write("Hello World!")
         //-->
      </script>
   </body>
</html>

نتیجه کد مانند زیر است:

Hello World!

 

فضای خالی و رفتن به خط بعدی

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

 

به کار بردن کاراکتر،  اختیاری است

معمولا هر خط کد یا دستور در جاوا اسکریپت، همانند آنچه در C++ یا Java دیده اید، با یک کاراکتر ; به پایان می رسد. اما در جاوا اسکریپت، چنانچه هر کد دستوری شما در یک خط جدا Line باشد، می توانید از به کار بردن کاراکتر; خودداری کنید. برای مثال در قطعه کد زیر، می توانید از به کار بردن ; در پایان هر دستور اجتناب نمایید.

<script language="javascript" type="text/javascript">
   <!--
      var1 = 10
      var2 = 20
   //-->
</script>

اما در قطعه کد زیر، هر دستور در هنگام پایان حتما بایستی با یک کاراکتر ; بسته شود.

<script language="javascript" type="text/javascript">
   <!--
      var1 = 10; var2 = 20;
   //-->
</script>

 

حساسیت به حروف کوچک و بزرگ

جاوا اسکریپت یک زبان حساس به بزرگ یا کوچک بودن حروف می باشد. این بدان معناست که که کلمات کلیدی زبان، نام متغیرها یا توابع و هر واژه دیگری بایستی با رعایت بزرگ یا کوچک بودن حروف نوشته شوند.
بنابراین کلمات Time، TIME و یا TiMe در این زبان با هم متفاوت می باشند.

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

 

توضیحات (comment) در جاوا اسکریپت

زبان جاوا اسکریپت از روشی همانند زبان C++ برای قرار دادن توضیحات در کدهای خود استفاده می کند  ودارای قانون های کلی زیر را می باشد.

  • هر متنی که بین یک // و پایان یک خط دستور قرار بگیرد، یک توضیح حساب می شود.
  • هر متنی که بین یک /* و */ قرار بگیرد، توضیح حساب شده و می تواند حتی شامل چندین خط دستور باشد.
  • جاوا اسکریپت، از کاراکتر ویژه برای زبان HTML ، <!-- جهت باز کردن توضیحات پشتیبانی می کند و دقیقا مانند توضیحات تک خطی (همان کاری که با // انجام می دهد) رفتار می کند.
  • جاوا اسکریپت، از کاراکتر ویژه زبان HTML ، --> جهت بستن توضیحات پشتیبانی نمی کند و به جای آن باید از //--> استفاده کرد.

مثال

مثال زیر نشان دهنده نحوۀ استفاده از نظرات در جاوا اسکریپت می باشد.

<script language="javascript" type="text/javascript">
   <!--
   
      // This is a comment. It is similar to comments in C++
   
      /*
      * This is a multiline comment in JavaScript
      * It is very similar to comments in C Programming
      */
   
   //-->
</script>
در صورتی که سوال و یا نظری دارید، از بخش نظرات با ما در میان بگذارید.

خبـرنــامه

Newsletters

در خبــرنـامه سافت اسکیل عضو شویــد تا جدیدترین هـای سایت را بلافاصله در ایمیل خـود دریافت کنیـد

شما چه نظر و یا سوالی درباره این نوشته دارید؟

مبحث آموزشی

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

Learn JavaScript

سرفصل ها

پرســیدن سؤال جدید

سؤال های تخصصی خود را از ما بپرسید

دنبال کردن تلگرام کانال سافت اسکیل

https://telegram.me/softskill_ir

عملیات کاربران

خبـرنــامه

Newsletters

در خبــرنـامه سافت اسکیل عضو شویــد تا جدیدترین هـای سایت را بلافاصله در ایمیل خـود دریافت کنیـد

کلیک کنید و سوالات خود را از ما بپرسید
لطفا فرم سوال را پر کنید

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

لطفا چند لحظه منتظر بمانید ...