אמהות והורות
ברכות ואיחולים
המדריך למדיניות העולם ומזרח התיכון
הסטוריה
חדשות
חידות
יצירות והפעלות
לימודי תוכנה
מוזיקה והופעות - זמרים
מסירה של כבוד
מראות קודש - תורה ויהדות
מתכונים
נדלן
נטוורקינג
סיקורים
סקרים
עזרה והתנדבות
עיצוב ואופנה
עסקים וכלכלה
פטנטים
צריכים משהו?!?
קורסים ומדריכים
קטלוגים
תרבות
-
ראה דף עסק
נושאים: 481
תגובות: 1292
לייקים: 983
React פרק 02 - מושגים מתקדמים בגאווה סקריפט -Arrow functions
08/12/2020 - 09:27
0
37

Arrow functions זוהי משתנה שהיא פונקציה.

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

אנחנו רגילים לקרוא לפונקציה ולהעביר לה משתנה בצורה זו:

function myName(name) {
     console.log(name);   
}

myName('יהודה');

אז מה בדיוק עשינו:
קראנו לפונקציה myName
והעברנו לו פרמטר אחד 'יהודה'
ובפונקציה קראנו לזה name
ובתוך הפונקציה יש לנו log למשתנה name.

אותו דבר שעשינו, אפשר לעשות בכתיבה שונה שהיא Arrow functions:

var myName = (name) => {
     console.log(name);   
}

myName('יהודה');

אז מה שינינו כאן:
יצרנו "משתנה" שהוא שווה ל.... פונקציה!!! בראבו!
אז איך מצהירים על משתנה? כמו תמיד:

var myName = (name)

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

אחרי שהבנו מה זה  Arrow functions, בואו נראה כמה כללים חשובים בעניין זה.

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

var myName = name => {
     console.log(name);   
}

myName('יהודה');

כלל שני:
כשנעביר שני פרמטרים לפונקציה, נהיה חייבים סוגריים כדלהלן:

var myName = (first_name , lest_name) => {
     console.log(first_name+' - '+lest_name);   
}

myName('יהודה', 'צין');

כלל 3:
אם לא נעביר שום פרמטר, נצטרך להשאיר סוגריים ריקות:

var myName = () => {
     console.log('לומדים React');   
}

myName();

עכשיו נכתוב arrrow function שמכפיל ב2 את המספר שהערנו לו בפרמטר. התוצאה כמובן תהיה = 4:

var multiply = (number) => {
   return number * 2;
}
console.log(multiply(2));  

עכשיו שימו לב שאפשר לכתוב את הArrow function בצורה יותר מקוצרת וללא סוגריים מסולסלות כלל:

var multiply = (number) =>  number * 2;

console.log(multiply(2)); 

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

 

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

בReact נראה הרבה שימוש בArrow function ולכן טוב שכבר יודעים בדיוק מה זה ואיך הוא עובד.

לייק
אתה 1

פוסטים נוספים באותו נושא

בדיוק כמו שבקובץ css אפשר לייבא קובץ אחר של css ובדיוק כמו שבphp אפשר לייבא קובץ א...
-
09/12/2020
0
31
Arrow functions זוהי משתנה שהיא פונקציה. נתחיל בפונקציה רגילה, נשנה קצת את צורת הכת...
-
08/12/2020
0
37
ברוכים הבאים ללימוד פיתוח אתרים ואפליקציות מבוסס ווב בReact React היא ספרייה בJav...
-
06/12/2020
0
33