Mohammad Ghorayshi
Mohammad Ghorayshi
خواندن ۴ دقیقه·۵ سال پیش

همه ی آنچه که باید درباره Function در JavaScript بدانید ...

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


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

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

توی این مطلب این مواردو میخونیم:

  • - تعریف توابع
  • فراخوانی توابع
  • مقدار بازگشتی توابع
  • پارامترها و متغیرها
  • تابع arrow function
  • توابع self-invoking

( برای اینکه تست هاتونو بگیرین نیاز نیست یه صفحه درست کنین و اجرا کنین، کافیه توی مرورگر راست کلیک کنین و inspect element بزنین و روی تب console برین، اینطوری کارتونو سریع تر انجام میدین)

تعریف توابع

توی جاوا اسکدیپت به دو صورت توابع را تعریف میکنیم

۱- تعریف تابع بصورت تابع

۲- تعریف تابع بصورت متغیر

تعریف تابع بصورت تابع : توی این حالت اول کلمه کلیدی function مینویسیم، بعد نام تابع مینویسیم و بعد پرانتز باز میکنیم و اگر تابع ما ورودی داره، متعیرهای ورودی مینویسیم و بعد پرانتز میبندیم، بعدش اکولاد باز میکنیم و کدهای تابع مینویسیم و بعد هم اکولاد میبندیم. اینطوری یه تابع نوشته میشه، البته از مرحله باز کردن اکولاد تا بستن توی تعریف های متفاوت توابع شبیه هم هستن.

function showName( name ) { return 'Hello ' + name; }

توی مثال بالا یه تابع به نام showName داریم که یک متغیر ورودی داره و توی خروجی مقدار ثابت name و مقدار ورودی برمیگردونه.

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

var showName = function( name ) { return 'Hello ' + name; }

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

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

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

var showName = function( name ) { return 'Hello ' + name; } showName( 'Dornica' );

خب الان این تابع اجرا میشه و یه رشته به عنوان خروجی برمیگردونه.

مقدار بازگشتی توابع

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

function sum1( a, b){ return a + b; } sum1( 1, 4 ) // return 5
function sum2( a, b){ a + b; } sum2( 1, 4 ) // return undefined

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

پارامترها و متغیرها

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

function showName( p1, p2, p3 ){ // do something }

در مثال بالا مقدار p1 و p2 و p3، پارامترهای ما هستند و متغیری در اینجا وجود نداره.

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

showName( 'Dornica', 'Mohammad', 'Ali');

در مثال بالا p1=Dornica و p2=Mohammad و p3=Ali به عنوان متغیرها هستند

بعصی وقتا ما نمیدونیم که باید چند تا متغیر برای یه تابع بفرستیم، باید قبلش چک کنیم که تعداد پارامترهای یک تابع چندتاست

function mul2( num ) { return 2 * num; } mul2( 10, 5, 2 ); // return 20 فقط عدد اول میگیره

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

توابع arrow

توی اکما اسکریپت ۶ ( ES6 ) این تابع معرفی شده، توابع فلش یا arrow function ها (<=) سینتکس کوتاه تری برای تعریف توابع دارند.

var showName = ( name ) => { return 'Hello ' + name; }

توی مثال بالا ما یک arrow function با نام showName نوشتیم که یک پارامتر داره، همونطور که میبینین کلمه کلیدی function توی تعریف این توابع حذف میشه البته چون یک پارامتر داریم میتونیم پرانتز هم حذف کنیم ولی برای بیشتر از یک پارامتر، حتما باید پرانتز بزاریم

توابع self-invoking

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

(function (num1, num2){ return num1 + num2; })()

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


با تشکر

http://dornica.net/

javascriptfunctions jsjsتوابع در جاوااسکریپتبرنامه نویسی
گروه نرم افزاری درنیکا
شاید از این پست‌ها خوشتان بیاید