50درصد تخفیف سورس فروشگاهی دیجی کالا + اپلیکیشن اندروید تا پایان این هفته - کد تخفیف : off50
با تخفیف میخرم

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

آموزش جاوا اسکریپت

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

 

تابع چیست؟

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

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

بعضی از مزیت های توابع جاوا اسکریپت بصورت زیر است :

  • توابع تکرار کدهای برنامه را کاهش می دهند : توابع به شما اجازه می دهد که کدهای معمول و پر استفاده را در یک کامپوننت یکتا قرار بدید. حالا شما می توانید همان تسک را بدون کپی و پیست کدهای یکسان, با فراخوانی تابع ,  همان کد را بارها و بارها اجرا کنید.
  • توابع نگهداری و توسعه کد را بسیار آسان می کند : از آنجا که تابع ساخته شده را بارها می توانید استفاده کنید, بنابراین هرگونه تغییر داخل تابع, بصورت خودکار در تمام جاهایی که کد استفاده شده, اعمال می شود.
  • توابع برطرف کردن خطاها را آسان تر می کنند : زمانی که یک برنامه به توابع تقسیم می شوند, اگر خطایی رخ دهد شما دقیقا می داند کدام تابع باعث ایجاد خطا شده و کجا می شود آن را پیدا کرد. بنابراین, دیباگ کردن آن ساده تر می شود.

 

تعریف و فراخوانی توابع جاوا اسکریپت

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

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

یک مثال ساده از تابع که پیام hello را نشان می دهد:

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

نکته: حرف اول نام تابع باید با حروف لاتین یا کاراکتر خط زیر (ـ) شروع شود و اجازه استفاده از اعداد را ندارید, بعد از حرف اول بصورت اختیاری می توانید از اعداد, حروف یا کاراکتر خط زیر به دلخواه استفاده کنید. نام توابع نیز مانند متغیر ها حساس به حروف کوچک و بزرگ است

 

افزودن پارامتر به توابع

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

پارامترها در اولین خط داخل پارانتزهای تابع ست می شوند :

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

می توانید هر چه تعداد که خواستید, پارامتر ست کنید. به هر حال هر پارامتری که مشخص کردید, در زمان فراخوانی نیاز به پاس دادن آرگومانی به آن خواهد بود, در غیر اینصورت مقدار undefined در نظر گرفته می شود :

مقادیر پیش فرض برای پارامترهای تابع ES6

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

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

قبل از ES6 برای داشتن ویژگی بالا نیاز بود همچنین ترفندی را لحاظ کنیم:

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

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

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

یک تابع نمی تواند چندین مقدار را برگشت دهد, به هر حال, می توانید همان نتیجه را بصورت آرایه ای از مقادیر برگشت دهید.

 

استفاده از عبارت برای تعریف تابع (Expression)

قاعده ای که در مثال های قبلی برای ساخت تابع استفاده می کردیم function Declaration بود. یک قاعده نوشتاری دیگر برای ساخت توابع وجود دارد که function expression‌ نامیده می شود.

همین که function expression در یک متغیر ذخیره شد, متغیر می تواند به عنوان تابع به اینصورت استفاده شود.

نکته ۱ : نیازی به استفاده از ; بعد از براکت ها در تعریف توابع بصورت declaration نیست اما در function expression ها باید از ; استفاده کنید.

نکته ۲ : در جاوا اسکریپت توابع می توانند در متغیرها, پاس دادن در توابع دیگر بصورت آرگومان, پاس داده شده به عنوان مقادیر بازگشتی توابع و اجرا در زمان ایجاد, ذخیره شوند.

قاعده نوشتاری function declaration و function expression بسیار مشابه هم هستند اما در استفاده تفاوت دارند.

همانطور که در مثال بالا می بینید, توابع expression یک خطا را هنگام استفاده قبل تعریف برگشت می دهند اما توابع declaration به راحتی اجرا می شوند.

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

توابع expression تا زمانی که به یک متغیر اختصاص داده نشوند, هنوز تعریف نشده هستند.

ES6 یک سینتکس کوتاه تر برای نوشتن توابع expression که arrow function نامیده می شود معرفی کرده است که در بخش های بعدی آن را یاد می گیریم.

 

درک محدوده متغیر

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

این قابل دسترس بودن را محدوده یا scope متغییر می نامیم.

بصورت پیش فرض, متغیرهای تعریف شده داخل یک تابع اسکوپ محلی (local scope) دارند به این معنی که نمی توانند خارج از تابع نمایش یا دستکاری شوند.

به هر حال, هر متغیری که خارج از تابع تعریف شود اسکوپ جهانی (global) داردو می تواند همه جای اسکریپت قابل دسترس باشد, چه داخل یا خارج تابع.

 

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

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

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

موفق باشید.

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

آموزش های رایگان بیشتر در اینستاگرام ما ...

NETPARADIS /
مطالب زیر را حتما بخوانید
دیدگاه کاربران

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

    دوره های آموزشی