שפת JavaScript - פונקציה חץ - Arrow

תמלול ההרצאה: שפת JavaScript - פונקציה חץ - Arrow

הטקסט המלא של הדקות הראשונות בהרצאה «שפת JavaScript - פונקציה חץ - Arrow» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.

1. 00:02

   השימוש ב-callbacks הוא מאוד מאוד נפוץ ב-JavaScript. אז בגרסה מסוימת של JavaScript יצא תחביר מקוצר יותר ל-callback function, או ליתר דיוק ל-anonymous function או inline functions.

2. 00:21

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

3. 00:36

   אז מה שאני רוצה לעשות זה לבנות את הצורך להשתמש ב-Inline Function ואז להפוך אותה ל-Arrow Function. בואו נניח שיש לנו כאן איזושהי פונקציה Do Something.

4. 00:49

   הפונקציה הזאת מקבלת Callback ומבצעת Console.Log. יש לנו פה Start יש לנו End והיא פשוט קוראת לה Callback בצורה כזאת. אם אנחנו רוצים לקרוא לדו סמפינג אנחנו צריכים לשלוח פונקציה מפני שאנחנו רואים שזאת קריאה לפונקציה אבל מה אנחנו בעצם רואים שהפונקציה לא מקבלת שום דבר ולא מחזירה שום דבר כמובן שזה בעצם

5. 01:20

   דוגמה מאוד כללית לא דוגמה של לוגיקה ספציפית אבל התחביר הוא מה שחשוב לנו אז איזה פונקציה אנחנו שולחים פונקשן ולא מקבלת שום דבר ולא מחזירה שום דבר בוא נניח שהיא עושה כמה פעולות קונסול לוג doing something ובואו נניח doing something else שתי הפעולות האלה.

6. 01:49

   בואו נריץ את זה node app go והנה אנחנו רואים start doing something ו-doing something else ואז end.

7. 01:58

   זאת inline function רגילה אנחנו רוצים את אותה קריאה לבצע בעזרת arrow function כל מה שאנחנו עושים אנחנו מוחקים את המילה פאנקשן ושמים פה חץ בין הסוגריים של הפונקציה לבין התוכן שלה אנחנו שמים חץ וקיבלנו את אותו הדבר אז זה מקרה ראשון תחביר ראשון לפונקציית אירו בואו נשכפל ונשים את זה בהערה ונגיד הפעם שהפונקציה שלנו מקבלת שלושה משתנים 10,

8. 02:34

   20 ו-30 ככה אנחנו שולחים לה הרי קודם כל מישהו בנה את do something רק אחר כך מישהו אחר משתמש ב-do something.

9. 02:46

   מי שבנה את do something מצפה לקבל callback ולשלוח לה שלושה משתנים. אז מי שעכשיו משתמש ב-do something ורוצה לשלוח לה callback צריך לקבל סוגריים שלושה משתנים.

10. 02:58

    אז אם הפונקציה המקורית הייתה function שקיבלה a, b ו-c ובוא נניח שאנחנו גם מציגים את a, b ו-c doing something, בואו נציג את a, b ו-c פה.

11. 03:13

    כאשר אנחנו בונים arrow function אז אנחנו פשוט מורידים את המילה function, שמים פה חץ והנה יש לנו עכשיו arrow function שמקבלת שלושה משתנים. הנה ה-10, 20, 30. זה בעצם תחביר מספר 2, arrow function יכולה לקבל משתנים.

12. 03:32

    בואו נגיד שאנחנו בתחביר הבא רוצים לשלוח משתנה בודד. אוקיי, מה הבעיה? בואו נקבל משתנה בודד וכמובן אין לי את b וc רק נציג את a.

13. 03:46

    אם אני מריץ אז אני רואה שהכל עובד פרפקט. למה התחביר הזה הוא תחביר מיוחד? כי אם אנחנו שולחים ל-arrow function שלנו משתנה בודד, אנחנו יכולים להיפטר מהסוגריים העגולים.

14. 04:02

    בואו נריץ, והנה אנחנו רואים שזה עובד אותו הדבר. אם אנחנו שולחים 0 משתנים, אנחנו לא יכולים להיפטר מהסוגריים העגולים. אם אנחנו שולחים יותר מאחד, אנחנו לא יכולים.

15. 04:17

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

16. 04:45

    כעת מה שאנחנו רוצים לעשות בתוך הפונקציה זה רק להציג doing something בלבד. מה הבעיה? לא אמורה להיות פה בעיה. אני מריץ, הנה start, הנה doing something והנה end.

17. 05:00

    למה זה תחביר מיוחד? מפני שכעת הפונקציה שאנחנו כותבים פה, ה-arrow function, כותבת בתוכה רק פקודה אחת. אם זה המצב, אנחנו יכולים להיפטר מהמסולסלים, להוריד את הנקודה פסיק הזאת ולהיפטר מהמסולסלים האלה.

18. 05:24

    ועכשיו יש לנו מצב שבו ה-arrow שלנו מכילה פקודה אחת בלבד. ושימו לב שזה אותו הדבר. בואו נעשה את זה שוב פעם, גם עבור המקרה הזה, שאנחנו יכולים לקבל שלושה משתנים.

19. 05:42

    נשים את זה פה, נוריד את זה, אנחנו פשוט רוצים לעבור ולראות את כל הוואריאציות שיש.

20. 05:51

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

21. 06:25

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