מדריך JS – פונקציות

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

יצירת פונקציות

למשל, במקרה שברצונך לחזור על אותו קוד כמה פעמים, אין צורך לכתוב אותו שוב ושוב. התחביר (Syntax)
של פונקציות ב-JS נראה כך:

<script type="text/javascript">
    function myFunction()
    {
        // statements
    }
</script> 

הקוד הנ"ל פשוט מאוד, הוא מתחיל במילה function שמכריזה על פונקציה, אחריה בא שם הפונקציה (myFunction)
– על שמות של פונקציות חלים אותם חוקים שחלים על שמות משתנים. מיד אחרי שם הפונקציה נפתחים סוגריים, בתוכם נשים את הארגומנטים (שאסביר עליהם בהמשך),
אחרי סגירת הסוגריים נפתחת הפונקציה בסוגריים מסולסלים ({), אחריהם באות הפקודות שאותה הפונקציה מבצעת, ואז היא נסגרת בעזרת סוגריים מסולסלים (}).

הנה פונקציה לדוגמא, שתדפיס את צמד המילים "Hello World!":

<script type="text/javascript">
    function helloWorld()
    {
        document.write("Hello World!");
    }
</script> 

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

הנה דוגמא לפונקציה המשתמשת בארגומנטים:

<script type="text/javascript">
    function sumUp(number1, number2)
    {
        var result = number1+number2;
        document.write(result);
    }
</script> 

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

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

נניח שאנו משתמשים בפונקציה sumUp, קריאה לפונקציה תראה כך:

<script type="text/javascript">
   sumUp(3,5);
</script> 

כעת, הארגומנט number1 מכיל את המספר 3, והארגומנט number2 מכיל את המספר 5,
אם נפעיל את הפונקציה הזאת כך, התוצאה תהיה שעל המסך יהיה כתוב 8. קריאה לפונקציות ללא ארגומנטים מתבצעת בדיוק אותו דבר,
רק שהסוגריים ריקים (תמיד יש סוגריים, אך במקרה הזה הם ריקים – אל תשכחי לכתוב את הסוגריים!).

החזרת ערכים מפונקציה

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

<script type="text/javascript">
    function sumUp(number1, number2)
    {
        var result = number1+number2;
        return result;
    }
</script> 

כעת הפונקציה מחזירה את הערך ולא מדפיסה אותו, דוגמא לשימוש בתכונה הזו:

<script type="text/javascript">
document.write(sumUp(3,5) / 2);
</script> 

עכשיו לקחנו את הערך שהתקבל מהפונקציה sumUp וחילקנו אותו ל-2. במקרה הזה, יודפס על המסך 4. אפשר להחזיר מפונקציות
גם מחרוזות, אובייקטים וכד', לא רק מספרים.

תגיות: , , , ,

תגובות בפייסבוק