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

لیست محتوای این بخش

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

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

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

شما در درس های قبلی این آموزش با توابع آماده جاوا اسکریپت همچون alert() و write() آشنا شدید . از این توابع بارها و بارها میتوانید استفاده کنید ولی کدهای درون این توابع در هسته ی جاوا اسکریپت فقط یکبار نوشته شده اند و این مزیت بزرگ جاوا اسکریپت محسوب میشود .

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

تعریف تابع در جاوا اسکریپت :

قبل از اینکه از تابعی استفاده بکنیم ، حتما باید آن تابع تعریف شده باشد . در جاوا اسکریپت تابع را میتوان با کلمه ی کلیدی function تعریف کرد که بعد از کلمه function میتوان نام یک تابع را نوشت و سپس لیستی از پارامترهای ارسالی به تابع ( که اختیاری است و میتواند خالی باشد ) و بعد از آن داخل یک آکولاد کدهای درون یک تابع را میتوان قرار داد .

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

<script type = "text/javascript">
   <!--
      function functionname(parameter-list) {
         statements
      }
   //-->
</script>

در مثال زیر یک تابع ساده به نام sayHello تعریف کردیم که هیچ پارامتر ورودی ندارد :

<script type = "text/javascript">
   <!--
      function sayHello() {
         alert("Hello there");
      }
   //-->
</script>

صدا زدن یک تابع در جاوا اسکریپت :

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

<html>
   <head>   
      <script type = "text/javascript">
         function sayHello() {
            document.write ("Hello there!");
         }
      </script>
      
   </head>
   
   <body>
      <p>Click the following button to call the function</p>      
      <form>
         <input type = "button" onclick = "sayHello()" value = "Say Hello">
      </form>      
      <p>Use different text in write method and then try...</p>
   </body>
</html>

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

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

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

<html>
   <head>   
      <script type = "text/javascript">
         function sayHello(name, age) {
            document.write (name + " is " + age + " years old.");
         }
      </script>      
   </head>
   
   <body>
      <p>Click the following button to call the function</p>      
      <form>
         <input type = "button" onclick = "sayHello('Zara', 7)" value = "Say Hello">
      </form>      
      <p>Use different parameters inside the function and then try...</p>
   </body>
</html>

دستور return در جاوا اسکریپت :

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

برای مثال شما اگر تابعی داشته باشد که دو عدد یا دو رشته را با هم جمع کند با دستور return میتوانید جمع آنها را برگردانید .

در مثال زیر دو رشته با هم ترکیب میشود و نتیجه return میشود

<html>
   <head>  
      <script type = "text/javascript">
         function concatenate(first, last) {
            var full;
            full = first + last;
            return full;
         }
         function secondFunction() {
            var result;
            result = concatenate('Zara', 'Ali');
            document.write (result );
         }
      </script>      
   </head>
   
   <body>
      <p>Click the following button to call the function</p>      
      <form>
         <input type = "button" onclick = "secondFunction()" value = "Call Function">
      </form>      
      <p>Use different parameters inside the function and then try...</p>  
  </body>
</html>

. اتمام .

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

دوره ی آموزش ویوجی اس ( Vuejs 3) پروژه محور به همراه Nuxt js دوره ی آموزش جاوااسکریپت-صفرتاصد کارگاه آموزشی کار با Grunt js

یک کتاب صوتی رایگان مهمان ما باشید

با ثبت نام و ورود به پنل کاربری خود ، یک کتاب صوتی رایگان به نام کتاب فقط برای تفریح ( داستان خلق لینوکس ) در پنل شما قرار میگیرد. این کتاب داستان زندگی یکی از تاثیرگذارترین برنامه نویسان تاریخ یعنی لینوس توروالدز است.

ثبت نام/ورود

ساخته شده با عشق در آواسام

تمام حقوق محفوظ است