جلسه 6: توابع جاوا اسکریپت

خواندن این مطلب 3 دقیقه زمان میبرد

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

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

تبلیغات

به مثال زیر دقت کنید:

<!DOCTYPE html>
<html>
<body>

<h2>توابع در جاوا اسکریپت</h2>
<p>در مثال زیر تابع محاسبات ریاضی را انجام داده و نتیجه را برمیگرداند</p>
<p id="demo"></p>

<script>
function myFunction(p1, p2) {
    return p1 * p2;
}
document.getElementById("demo").innerHTML = myFunction(4, 3);
</script>

</body>
</html>

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

در زبان جاوا اسکریپت برای تعریف توابع از کلید واژه function استفاده میشود، سپس برای تابع باید نامی انتخاب کنیم این نام میتواند شامل حروف، ارقام، علامت $ باشد. قوانین انتخاب نام تابع همانند انتخاب نام برای متغیرهاست. سپس در جلوی نام تابع از پرانتز باز و بسته استفاده میکنیم به این صورت ()function myfunction. پارامترهای داخل پرانتز با کاما(،) از همدیگر جدا میشوند سپس بایستی دستوراتی که میخواهیم بنویسیم را درون کروشه باز و بسته قراردهیم به این صورت {دستورات}()function myfunction.

در مثال زیر میتوانید ساختار کلی یک تابع را ببینید:

function name(پارامتر1, پارامتر2, پارامتر3) {
    دستورات
}

پارامترهایی که در توابع استفاده میشوند همانند متغیرهای محلی هستند.

تبلیغات

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

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

به مثال زیر دقت کنید تا به خوبی این مطلبو درک کنید:

var x = myFunction(4, 3);    // تابع در این جا فراخوانی شده و مقدار نهایی در متغیر(ایکس) قرار خواهد گرفت

function myFunction(a, b) {
    return a * b;            // تابع نتیجه محاسبات را بازمیگرداند
}

نتیجه به شکل زیر خواهد بود:

چرا از توابع استفاده میکنیم؟

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

زیرا ما میتوانیم یک مرتبه یک تابع را تعریف کنیم و به دفعات متعدد از آن تابع استفاده کنیم. ما میتوانیم از یک تابع با دادن مقدار های مختلف نتایج مختلفی را بدست آوریم.

تبلیغات

<!DOCTYPE html>
<html>
<body>

<h2>توابع در جاوا اسکریپت</h2>
<p>تابع زیر مقدار فارنهایت را به سلسیوس تبدیل میکند</p>
<p id="demo"></p>

<script>
function toCelsius(f) {
    return (5/9) * (f-32);
}
document.getElementById("demo").innerHTML = toCelsius(77);
</script>

</body>
</html>

بنابراین نتیجه برابر است با:

پرانتز () توابع را فراخوانی میکند

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

به مثال زیر دقت کنید:

<!DOCTYPE html>
<html>
<body>

<h2>توابع در جاوا اسکریپت</h2>
<p id="demo"></p>

<script>
function toCelsius(f) {
    return (5/9) * (f-32);
}
document.getElementById("demo").innerHTML = toCelsius;
</script>

</body>
</html>

نتیجه به صورت زیر خواهد بود:

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

function toCelsius(f) { return (5/9) * (f-32); }

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

تبلیغات

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

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

به مثال زیر دقت کنید:

استفاده از متغیر x برای ذخیره مقدار برگشتی تابع:

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

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

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

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

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

تبلیغات

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

به مثال زیر دقت کنید تا این مطلب را به خوبی درک کنید:

<!DOCTYPE html>
<html>
<body>

<h2>توابع در جاوا اسکریپت</h2>
<p id="demo1"></p>
<p id="demo2"></p>

<script>
myFunction();
function myFunction() {
    var carName = "Volvo";
    document.getElementById("demo1").innerHTML =
    typeof carName + " " + carName;
}
document.getElementById("demo2").innerHTML =
typeof carName;
</script>

</body>
</html>

نتیجه به صورت زیر است:

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

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

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

تبلیغات

جلسه بعد

جلسه قبل