JavaScript Functions

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

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

نحوه نوشتن تابع در جاوا اسکریپت

برای نوشتن تابع در جاوا اسکریپت ابتدا باید از کلید واژه function استفاده کنیم. سپس نام تابع را نوشته و جلوی آن علامت پرانتز () را قرار می‌دهیم. داخل پرانتز نام پارامترهای تابع را می‌نویسیم. اسم تابع هم دقیقاً از همان قوانینی که برای نام گذاری متغیرها گفته شد باید پیروی کند.

در نهایت کدی که می‌خواهیم اجرا شود را داخل آکولاد می‌نویسیم.

function name(parameter1, parameter2, parameter3) {
// code to be executed
}

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

به پارامترهای تعریف شده برای تابع، آرگومان (arguments) هم گفته می‌شود. در حقیقت با فراخوانی تابع مقادیر ورودی که به تابع داده می‌شود همان آرگومان‌های تابع می‌باشند.

داخل تابع، آرگومان‌ها (پارامترها) به صورت متغیرهای محلی (local) رفتار می‌کنند. (در آخر همین صفحه در مورد متغیرهای محلی بیشتر توضیح داده شده است.)

فراخوانی تابع

  • فراخوانی با اتفاق افتادن یک رخداد (event). (مانند زمانیکه کاربر روی دکمه‌ای کلیک می‌کند.)
  • فراخوانی از داخل یک کد جاوا اسکریپت
  • به صورت خودکار (خود فراخوان)

در آموزش‌های بعدی در مورد فراخوانی تابع بیشتر خواهید آموخت.

کلید واژه return

زمانیکه تابع به کلید واژه return برسد، اجرایش متوقف می‌شود. در حقیقت return آخرین دستور در تابع است و مقدار محاسبه شده را به فراخواننده خود بر می‌گرداند.


<!DOCTYPE HTML>
<html>
  <body>
    <h2> JavaScript Functions </h2>
    <p> This example calls a function which performs a calculation and returns the result: </p>
    <p id = "demo"> </p>
    <script>
      var x = myFunction(4, 3);
      document.getElementById("demo").innerHTML = x;

      function myFunction(a, b) {
        return a * b;
      }
    </script>
  </body>
</html>

خروجی:

چرا تابع

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


<!DOCTYPE HTML>
<html>
  <body>
    <h2> JavaScript Functions </h2>
    <p> This example calls a function to convert from Fahrenheit to Celsius: </p>
    <p id = "demo"> </p>
    <script>
      function toCelsius(f) {
        return (5/9) * (f-32);
      }
      document.getElementById("demo").innerHTML = toCelsius(77);
    </script>
  </body>
</html>

خروجی:

علامت ()

در استفاده از مثال بالا، toCelsius به شی تابع (function object) اشاره دارد و toCelsius() به نتیجه تابع. فراخوانی تابع بدون علامت پرانتز به جای نتیجه تابع شی تابع را برمی‌گرداند. نتیجه مثال زیر را با مثال بالا مقایسه کنید.


<!DOCTYPE HTML>
<html>
  <body>
    <h2> JavaScript Functions </h2>
    <p> This example calls a function to convert from Fahrenheit to Celsius: </p>
    <p id = "demo"> </p>
    <script>
      function toCelsius(f) {
        return (5/9) * (f-32);
      }
      document.getElementById("demo").innerHTML = toCelsius;
    </script>
  </body>
</html>

خروجی:

استفاده از تابع به عنوان مقدار یک متغیر

تابع را می‌توان همانند متغیرها در همه انواع فرمول‌ها، تخصیص دادن‌ها و محاسبات استفاده کرد.

var x = toCelsius(77);
var text = "The temperature is " + x + " Celsius";

متغیرهای محلی

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

// code here can NOT use carName

function myFunction() {
  var carName = "Volvo";
  // code here CAN use carName
}

// code here can NOT use carName

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

متغیرهای محلی با شروع تابع ساخته و با پایان یافتن آن حذف می‌شوند.