כדאי להכיר: Higher Order Functions ב-JavaScript

Higher Order Functions הן פונקציות המקבלות פונקציה כארגומנט או מחזירות פונקציה ב-return.
השימוש ב-Higher Order Functions יגרום לקוד שלנו להיות קצר, נקי וקל יותר להבנה.

במאמר זה אסקור 3 מתודות נפוצות ב-JavaScript מסוג זה: filter, map ו-reduce.

שנתחיל?

filter

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

const numbers = [5, 10, 3, 12, 8, 9, 22];
const evenNumbers = [];

for(i = 0; i <= numbers.length; i++) {
	if((numbers[i] % 2) === 0) {
  	evenNumbers.push(numbers[i]);
  }
}

והאמת שזה עובד מעולה, זהו הפלט שיצא:

10,12,8,22

אבל האמת ש-filter יבצע את זה בצורה אלגנטית יותר:

const numbers = [5, 10, 3, 12, 8, 9, 22];
const evenNumbers = numbers.filter(num => {
	return num % 2 === 0
});

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

map

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

const numbers = [5, 10, 3, 12, 8, 9, 22];
const numbersPlus1 = numbers.map(num => num + 1);

אם נדפיס את המערך numbersPlus1 זה מה שנקבל:

6,11,4,13,9,10,23

כמה פשוט? 🙂

reduce

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

const numbers = [5, 10, 3, 12, 8, 9, 22];
const sumOfNumbers = numbers.reduce((sum, number) => sum + number);

שימו לב שבמקרה זה הייתי חייב לעטוף את הארגומנטים ב-Arrow function בסוגריים מכיוון שיש לי יותר מארגומנט אחד.
הארגומנט הראשון (sum) הוא הסכום עד כה והארגומנט השני (number) הוא המספר הנוכחי שמוסיפים ל-sum.

סיכום

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

בהצלחה!

נהנת ממאמר זה? הירשם לרשימת התפוצה וקבל עדכונים על מאמרים חדשים!

רק רגע! :)
כשאני לא כותב פוסטים ב-CodeBrain אני מספק שרותי פיתוח, ייעוץ והדרכה.
אם נראה לך שאני האיש המתאים עבורך, כדאי שנדבר :)