פונקציות ב- JavaScript: מדריך למתחילים

פונקציה היא סט של הכרזות (statements בלעז) המקבלות input, מבצעות חישוב מסויים, ומספקות output. במילים אחרות, פונקציה היא סט של הכרזות המבצעות מספר פעולות או חישובים ולאחר מכן מחזירה את התוצאה למשתמש.

הרעיון הוא להכניס מספר פעולות שחוזרות על עצמן ולייצר מאלו פונקציה, כך שבמקום לכתוב את אותו קוד, את אותן פעולות שוב ושוב עבור input שונה, ניתן פשוט יהיה לקרוא לאותה פונקציה ולחסוך את הכתיבה של הקוד כל פעם מחדש.

וכמו בכל שפת תכנות, JavaScript גם כן תומכת בפונקציות, וכנראה שכבר יצא לכם להשתמש בפונקציות כאלו ואחרות ב JavaScript כמו למשל הפונקציה alert() שהיא פונקציה מובנית ב JavaScript.

אך Javascript מאפשרת יצירה של פונקציות מוגדרות בעצמכם. ניתן ליצור פונקציות ב JavaScript באמצעות מילת המפתח function, כשהסינטקס הבסיסי ליצירת פונקציה נראה כך:

function functionName(Parameter1, Parameter2, ..)
{
    // Function body
}

כפי שאתם רואים, בכדי ליצור פונקציה ב JavaScript עלינו בתחילה להשתמש במילה function ולאחר מכן יש לרשום את שם הפונקציה ולאחר את הפרמטרים שהיא מקבלת בסוגריים. החלק במופיע בתוך הסוגריים המסולסלות הוא גוף הפונקציה עצמה.

הגדרת הפונקציה – Function Definition

בואו נראה מספר חוקים ליצירת פונקציה ב JavaScript. בתור התחלה, על כל פונקציה להתחיל עם המילה function ולאחריה:

• שם הפונקציה אותו המשתמש בוחר. שם זה צריך להיות ייחודי (unique).
• רשימת פרמטרים בתוך סוגריים ומופרדים בפסיק.
• רשימה של הכרזות או פעולות בגוף הפונקציה כשאלו נמצאות בתוך הסוגריים המסולסלים.

הנה דוגמה:

function calcAddition(number1, number2) 
{ 
    return number1 + number2; 
}

בדוגמה זו יצרנו פונקציה בשם calcAddition. הפונקציה מקבלת שני מספרים כפרמטרים ומחזירה את סכום המספרים כתוצאה באמצעות  return statement (עליו נדבר בהמשך).

פרמטרים בפונקציה – Function Parameters

בואו נדבר קצת על אותם פרמטרים של פונקציות JavaScript. אותם פרמטרים הם אינפורמציה המועברת לפונקציה. בדוגמה שהצגנו מעלה, התפקיד של הפונקציה calcAddition הוא לחשב את הסכום של שני מספרים. כפי שהסברנו, אותם מספרים מועברים לפונקציה בתוך סוגריים לאחר שם הפונקציה ומופרדים בפסיק.

ברמת טרמינולוגיה, הפרמטרים של פונקציה ב JavaScript הם השמות אותם רשמתם בסוגריים כשהגדרתם את הפונקציה. הארגומנטים הם הערכים האמיתיים שאתם מעבירים לפונקציה.

פונקציה ב JavaScript יכולה לקבל עד 255 פרמטרים אך סביר להניח שלעולם לא תאלצו להשתמש בכמות כזו גדולה. שימו לב גם שאין צורך להגדיר את סוג המשתנה (variable) של אותם פרמטרים בג׳אווה סקריפט (Integer, String etc).

קריאה לפונקציית JavaScript

לאחר שהגדרתם את הפונקציה, השלב הבא הוא לקרוא לאותה פונקציה (בכדי לעשות בה שימוש). ניתן לקרוא לפונקציה על ידי כתיבת שם הפונקציה יחד עם ערכים כלשהם כמספר הפרמטרים שהפונקציה מקבלת (בתוך סוגריים) ונקודה-פסיק (semicolon) בסוף.

functionName( Value1, Value2, ..);

הנה דוגמת קוד המתארת עבודה עם פונקציות ב JavaScript:

<script type = "text/javascript">
  
// Function definition
function welcomeMsg(name) {
   document.write("Hello " + name + " welcome to Colombia");
}
  
// creating a variable
var nameVal = "Admin";
  
// calling the function
welcomeMsg(nameVal);
  
</script>

התוצאה תהיה:

Hello Admin welcome to Colombia

הערך שהפונקציה מחזירה – Return Statement

ישנם מצבים בהם אנו רוצים שהפונקציה תחזיר ערכים מסויימים לאחר שזו ביצעה מספר פעולות. במקרים אלו אנו יכולים להשתמש ב return statement. אותו return statement שהפונקציה יכולה להחזיר הוא אופציונלי, ובדרך כלל מופיע בשורה האחרונה של גוף הפונקציה.

תנו שוב מבט בדוגמה הראשונה של הפונקציה calcAddition. הפונקציה מחשבת את הסכום של שני המספרים ומחזירה את התוצאה באמצעות אותו return statement. הסינטקס הבסיסי של ה return statement נראה כך:

return value;

אותו return statement מתחיל עם המילה return כשלאחריו הערך אותו אתם מעוניינים להחזיר. ניתן להשתמש גם בביטוי כלשהו כשמחזירים את הערך כבדוגמה הבאה:

return value + 1;

עד כאן. אם מצאתם עניין בפוסט אולי תרצו לתת מבט בפוסט משחק עם מערכים (arrays) ב JavaScript, או הקדמה לאובייקטים ב JavaScript.

הפוסט נכתב בהשראת הפוסט הבא ותורגם במרביתו עם תוספות שונות. בהצלחה 🙂