مفاهیم پایه جاوا اسکریپت - تابع

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

تابع (Function) چیست؟

به صورت خیلی ساده تابع عبارتست از قطعه کدیکه وظیفه ای را انجام می دهد یا مقدار/مقادیری را محاسبه کرده و بر می گرداند. یک برنامه واقعی شامل صدها یا هزاران تابع مختلف است که در ارتباط با هم کارکردهای مختلف یک برنامه را پیاده سازی می کنند. برای تعریف یک تابع از کلمه کلیدی و رزرو شده function استفاده می کنیم مثل زیر که تابعی به نام greet را تعریف می کند:

function greet() {
}

قطعه کدیکه مابین کمانک های باز و بسته { } قرار می گیرد اصطلاحا بدنه تابع نامیده می شود. بدنه تابع یک سری statement است که منطقی را پیاده سازی می کند. مثلا ما می خواهیم در تابع ()greet منطقی را ایجاد کنیم که یک پیغام را در خروجی نمایش دهد:

function greet() {
     console.log('Hello World');
}

به قطعه کد بالا اصطلاحا اعلان تابع (Function Declaration) گفته می شود.

توجه: بعد از کمانک بسته { نبایستی نقطه ویرگول قرار دهیم.

بعد از اینکه یک تابع تعریف شد می توانیم آن را هر جا که نیاز شد و به دفعات مختلف فراخوانی (Call) کرده و اجرایش کنیم. برای فراخوانی یک تابع مثل زیر باید عمل کنیم:

greet();

حالا اگر به کنسول بروید عبارت Hello World را در خروجی خواهید دید.

اما تابع فوق ساده ترین نوع یک تابع است. توابع می توانند یک یا چندین مقدار ورودی (Input) داشته باشند. این ورودی ها می توانند رفتار تابع را تغییر دهند. فرض کنید بخواهیم بجای عبارت ساده و ثابت Hello World، به صورت پویا و بر اساس یک مقدار ورودی مثل نام که به تابع ()greet پاس می دهیم، عبارت متناسبی را در خروجی نمایش دهیم آنگاه باید به صورت زیر تابع را اعلان کنیم:

function greet(name) {
     console.log('Hello ' + name);
}

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

نکته: برای اتصال چندین مقدار رشته ای به هم از عملگر + استفاده می کنیم.

سوال اینجاست که توابعی که پارامتر دارند را چگونه فراخوانی کنیم. ببینیم اگر تابع ()greet بالا را که یک پارامتر دارد به صورت زیر فراخوانی کنیم چه می شود:

greet();

در این صورت مقدار Hello undefined در خروجی نمایش داده خواهد شد. چون همانطور که قبلا در مبحث متغیرها گفتیم، اگر یک متغیر را مقدار دهی نکنیم، مقدارش به طور پیش فرض undefined خواهد بود. بنابراین برای عملکرد صحیح تابع ()greet باید موقع فراخوانی آن، مقداری را به عنوان ورودی به آن پاس بدهیم مثل زیر:

greet('Ali');

حالا مقدار Hello Ali در خروجی نمایش داده خواهد شد.

نکته: به مقداریکه موقع فراخوانی تابع به آن پاس می دهیم اصطلاحا آرگومان (Argument) می گویند مثل رشته Ali در تابع ()greet. اما به متغیریکه هنگام تعریف تابع به آن می دهیم اصطلاحا پارامتر (Parameter) گفته می شود مثل متغیر name در تابع ()greet.

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

یک تابع می تواند چندین پارامتر داشته باشد. در صورتیکه یک تابع چندین پارامتر داشت باید آن ها را در اعلان تابع با ویرگول از هم جدا کنیم مثل زیر:

function greet(name, lastName) { 
     console.log('Hello ' + name + ' ' + lastName); 
}

greet('Ali', 'Taghani');

با اجرای کد بالا عبارت Hello Ali Taghani در خروجی ثبت خواهد شد. بعدا که راجع به Template Literal صحبت کردم خواهید دید که می شود بدنه تابع بالا را ساده تر و کوتاه تر هم نوشت.

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

function square(number) {
     return number * number;
}

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

با مقدار برگشتی از یک تابع هر کاری می توانیم انجام دهیم مثل اینکه آن را در جایی نمایش دهیم یا با آن متغیری را مقدار دهی کنیم مثل زیر:

let result = square(2);
console.log(result);

اگر خروجی تابع ()square را به صورت زیر در خروجی نمایش دهیم، دو تا فراخوانی تابع خواهیم داشت که به صورت تو در تو هستند، یکی فراخوانی تابع ()square و دومی فراخوانی تابع ()log از آبجکت console:

console.log(square(2));

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

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