פונקציות ב-Javascript
function, עם שם, סוגריים לרשימת הפרמטרים (ריקים אם אין כאלה), ובלוק קוד. הקוד בתוכה לא רץ בטעינת הדף, אלא רק כשקוראים לה בשמה, ואפשר לקרוא לה כמה פעמים.var לפני שם הפרמטר. בדוגמה הפונקציה showMax מקבלת שני ערכים ומציגה את הגדול מביניהם.return מחזיר ערך מהפונקציה, והקורא יכול לשמור אותו במשתנה ולעשות איתו משהו.undefined. בשפות רבות זה לא אפשרי, אבל ב-JavaScript זה כן.js נפרד מקושרת לדף בתגית script עם src. אחרי הקישור הדף מכיר את הפונקציות שבקובץ וקורא להן כמו פונקציות שבדף.is, למשל לבדיקה אם מספר חיובי. מחזירים את התנאי עצמו, כי הוא כבר true או false.return מסיים את הפונקציה מיד, ולכן אחריו אין צורך ב-else.להורדת קוד מקור של כל הדוגמאות בקורס JAVA SCRIPT למתחילים -לחץ כאן לתלמידי המכללה בלבד
להורדת קוד מקור של כל הדוגמאות בקורס JAVA SCRIPT למתקדמים- לחץ כאן לתלמידי המכללה בלבד
פרקי ההרצאה: פונקציות ב-Javascript
תמלול ההרצאה: פונקציות ב-Javascript
הטקסט המלא של הדקות הראשונות בהרצאה «פונקציות ב-Javascript» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.
מה שאנחנו הולכים לראות עכשיו בג'אווה סקריפט הוא דבר מאוד בסיסי ובסיס לדברים אחרים שאנחנו הולכים לראות בהמשך, וזה פונקציות.
בואו נסתכל רגע על קטע קוד קטן שעשינו מקודם. נניח שאני רושם אלרט, היי, ואני הולך להריץ את הדף. אז אנחנו ראינו מקודם שהאלרט הזה מתבצע כאשר הדף נטען.
אפשר לראות כרגע שהאלרט מיד התבצע. בואו נסגור את הדף. הסיבה שהוא התבצע מיידית זה מפני שהקוד שכתבנו נמצא ישירות בתוך הסקריפט.
אנחנו יכולים לכתוב את הקוד הזה בתוך משהו שנקרא function. אנחנו מחויבים לתת שם לפונקציה, לדוגמה say היי, להגדיר סוגריים שבתוכה אנחנו הולכים לרשום רשימת פרמטרים או משאירים אותם ריקות אם הפונקציה לא מקבלת שום דבר, ובתוכה לכתוב את הקטע קוד.
בואו נשמור, נריץ את זה כעת, ונראה בעצם שלמרות שהדף עולה, שום דבר לא קורה. אנחנו רואים שלא קיבלנו פה שום אלרט, שום תיבה לא קופצת.
הסיבה היא כי הקוד שאנחנו כתבנו נמצא בתוך פונקציה משלנו, ורק אם מישהו יקרא לפונקציה, אז תתבצע. אז בואו נקרא לה כאן. נריץ כעת את התוכנית עוד פעם, ואנחנו רואים שקיבלנו היי.
אם אני עכשיו הייתי משכפל את הפונקציה הזאתי, את הקריאה ליתר דיוק, זאת אומרת ששלוש פעמים קראתי לפונקציה שלנו. בואו נריץ.
הנה היי ראשון, הנה היי שני, הנה היי שלישי. זאת אומרת שאנחנו יכולים לכתוב קטע קוד ולקרוא לו בכמה מקומות, וזה עוד יתרון בפונקציות, מעבר לזה שהקוד לא רץ בתחילת התוכנית, ושיכול להיות מצב שאנחנו רוצים לאגד כמה פקודות ביחד באיזושהי פונקציה, כדי שהיא תתבצע כאשר
אנחנו קוראים לה או לצורך חישוב מסוים. אוקיי, בואו נראה כמה דברים נוספים בקשר לפונקציות. דבר ראשון, פונקציה מסוגלת לקבל ערכים ולבצע איתם איזשהו חישוב.
בואו נכתוב פונקציה שנקרא לה show max והיא תקבל שני ערכים. כאשר אנחנו מקבלים ערכים לפונקציה אנחנו פשוט רק רושמים את השמות שלהם בסוגריים.
בגלל שאנחנו ראינו שכל משתנה הטיפוס שלו הוא var, אנחנו לא רושמים var לפני הטיפוס כי זה דבר שהוא ברור מאליו. עכשיו בוא נניח שאני פותח פה איזשהו max, נכניס לתוכו את הערך המקסימלי מתוך a וb אם a יותר גדול מb אנחנו נכניס את a אחרת נכניס את b ונציג את max.
כעת אם אנחנו נקרא לפונקציה הזאת show max אנחנו רואים שהיא מבקשת מאיתנו לתת שני המספרים. בואו ניתן 1 1 ו-2 2 נריץ את התוכנית ונראה שהפונקציה פשוט קיבלה את שני הערכים עשתה איזשהו חישוב והציגה את התוצאה.
דבר נוסף שאפשר לעשות מפונקציות זה להחזיר תוצאה. בואו נבנה פונקציה נוספת שנקראת getMax מקבלת שני ערכים מוצאת את הערך המקסימלי אבל לא מציגה אותו אלא מחזירה אותו לצורך החזרה אנחנו משתמשים בפקודת ריטיון כעת כשאני קורא לפונקציה אני יודע שהיא הולכת להחזיר לי ערך בחזרה אם אני עכשיו נותן לה את 1,1 ו-2,2 אני אמור גם לקבל בחזרה את הערך לדוגמה נפתח
פה ריזולט ולאחר מכן נעשה משהו עם הריזולט בואו נציג אותו בואו נריץ אנחנו הפעלנו את הפונקציה, קיבלנו את הערך בחזרה והצגנו אותו.
עכשיו יש נתון מאוד מעניין בקשר לפונקציות בג'אווה סקריפט. פונקציה יכולה לקבל כמה ערכים, בואו ניתן דוגמה. נקבל את a, b, c ו-d, ובואו נניח שהיא מציגה אותם.
בואו נקרא לפונקציה הזאת, ואני רואה שהיא מבקשת ממני את כל הערכים. ניתן לה ארבע ערכים, נכבה את הקריאות הקודמות, בואו נריץ.
כמובן שאנחנו הולכים לראות שהפונקציה קיבלה את הערכים ומציגה אותם. אבל הדבר שמעניין בקשר לפונקציות בג'אווה סקריפט זה שאנחנו לא חייבים לשלוח לה את כל הערכים.
בואו נגיד שאנחנו לא שולחים לה שני הערכים אחרונים אלא רק שניים ראשונים. בואו נריץ ונראה מה עכשיו ערכם של הערכים שלא שלחנו. אנחנו רואים שהערך הראשון התקבל והוא 1,1.
הערך השני התקבל והוא 2,2. הערך השלישי undefined. זאת אומרת שפונקציה יכולה לדרוש ערך מהמשתמש, כלומר מהמתכנת השני והמתכנת השני בעצם לא שולח לה את הערך הזה ואז ערכו יהיה undefined בתוך הפונקציה כנ"ל החלק הרביעי עכשיו שלא שלחתי אותו גם כן גם הוא undefined אז בעצם זאת
התנהגות מאוד מעניינת שיש המון שפות אחרות שלא מאפשרות לעשות דבר כזה לא מאפשרות לקרוא לפונקציה ולשלוח לה רק חלק מהערכים JavaScript מאפשרת לעשות את זה כאשר הערכים הראשונים שאנחנו שולחים נכנסים בהתאמה לפרמטרים הראשונים והאחרים לא מתקבלים. זאת אומרת שאנחנו לא חייבים לשלוח לפונקציה את כל הפרמטרים שהיא אמורה
לקבל. אנחנו גם יכולים לכתוב פונקציה שנמצאת בקובץ js חיצוני. בואו נצרף קובץ JavaScript חיצוני, וכאן נכתוב את הפונקציה שלנו.
אוקיי, נשמור את הקובץ הזה, נקרא לו myfunctions, או יותר נכון functions.js, נשמור אותו ביחד עם קובץ ה-HTML, שניהם נמצאים על הדסטופ כרגע, ואם אנחנו זוכרים אנחנו צריכים להפנות את קובץ ה-HTML,
לקובץ ה-JS החיצוני, כלומר שקובץ ה-HTML יכיר אותו, וזה מתבצע על ידי סקריפט נוסף, בואו נעתיק את ההתחלה של הסקריפט הזה, נדביק ונוסיף src שווה, נגדיר את הקובץ ההוא כטארגט, ולא לשכוח לסגור את התגיד.
כעת הקובץ שלנו מכיר גם את קובץ ה-JavaScript החיצוני, וזה אומר שהוא מכיר גם את הפונקציות שבו. אז בואו כרגע נכבה את הקריאה הקודמת, ונקרא ל-showMessage.
אנחנו כבר יכולים לראות אותו פה באינטליסנס בחלון ההצעות. הוא מקבל איזשהו מסג', בואו נריץ, ונראה שלמרות שהפונקציה נמצאת בקובץ JavaScript חיצוני, אם אנחנו ביצענו הכוונה אליו או בעצם קישור אליו, אז הקובץ HTML שלנו מכיר אותו ואנחנו יכולים להשתמש בכל הפונקציות שנמצאות בו.
אוקיי, מה קורה אם יש לנו שתי פונקציות עם אותו השם? בואו ניקח כאן function, do something, שמציגה איזושהי הודעה.
ניקח פונקציה נוספת עם אותו השם שמציגה doing something else. אם אני כאן קורא ל-do something, איזה פונקציה מביניהם תהיה מוצגת? בואו נריץ ונראה מה יוצא מזה.
אז אנחנו רואים שבעצם קיבלנו את התוכן של הפונקציה השנייה, כאילו שהפונקציה השנייה דרסה את הפונקציה הראשונה. מה יקרה אם הקריאה לפונקציה תהיה אחרי הפונקציה הראשונה ולפני הפונקציה השנייה?