דרכים לאיחוד מערכים ב-JavaScript ועל ההבדלים ביניהן

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

שימוש ב-concat

איחוד בין שני מערכים באמצעות concat היא הדרך "הקלאסית":

let arr1 = ["Samantha", "Jack", "Thomas"];
let arr2 = ["John", "Sara", "Christian"];

let combinedArr = arr1.concat(arr2);
console.log(combinedArr);

וזה מה שנקבל כמובן:

ניתן לראות ששני המערכים הפכו למערך אחד מאוחד
ניתן לראות ששני המערכים הפכו למערך אחד מאוחד

גם את זה אפשר לשפר טיפה

אחת "החולשות" (אם ניתן לקרוא לזה כך) בשיטה זו זה שהיא מעט מבלבלת, המערך הראשון נכתב תחילה ובאמצעות המתודה concat אנחנו מעבירים את המערכים הבאים שנרצה לצרף למערך הראשון.
טיפ קטן שעושה את העניין טיפה יותר "אסתטי":

let arr1 = ["Samantha", "Jack", "Thomas"];
let arr2 = ["John", "Sara", "Christian"];

let combinedArr = [].concat(arr1, arr2);

כמובן שהתוצאה תהיה זהה לגמרי.

שימוש ב-spread

בתקן ES6 הנפלא (והדי וותיק) נוסף פיצ'ר מאוד מעניין בשם spread. אם אתם לא מכירים, כתבתי עליו פוסט: Spread Operator ב-JavaScript.
כך יהיה איחוד מערכים באמצעות spread:

let arr1 = ["Samantha", "Jack", "Thomas"];
let arr2 = ["John", "Sara", "Christian"];

let combinedArr = [...arr1, ...arr2];

גם כאן התוצאה תהיה זהה.

היזהרו כשאתם משתמשים ב-spread

כשאתם עושים שימוש ב-spread שימו לב שאתם חייבים לוודא שכל הנתונים הם מסוג מערך.
במידה ותנסו לעשות spread למחרוזת (string), כך למשל:

let arr1 = ["Samantha", "Jack", "Thomas"];
let arr2 = "John";

let combinedArr = [...arr1, ...arr2];
console.log(combinedArr);

זה מה שתקבלו:

ניתן לראות ש-John התפצל, כל אות נהייתה איבר במערך.
ניתן לראות ש-John התפצל, כל אות נהייתה איבר במערך.

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

שימוש ב-push

כולם מכירים את push שמאפשרת להוסיף איברים למערך קיים:

let arr1 = ["Samantha", "Jack", "Thomas"];
let newName = "John";

let combinedArr = arr1.push(newName);
console.log(combinedArr);
console.log(arr1);

אבל שימו לב, push מחזירה את מספר האיברים במערך החדש, לאחר התוספת, לכן combinedArr מחזיר 4 והמערך arr1 הוא המערך המאוחד כרגע.
כלומר יש לזכור שהמתודה Push משנה את המערך.

ניתן לראות כי combinedArr מכיל את מספר האיברים לאחר האיחוד ואילו arr1 הוא האיחוד של שני המערכים.
ניתן לראות כי combinedArr מכיל את מספר האיברים לאחר האיחוד ואילו arr1 הוא האיחוד של שני המערכים.

אבל בוודאי שגם כאן ניתן להשתמש ב-spread:

let arr1 = ["Samantha", "Jack", "Thomas"];
let arr2 = ["John", "Sara", "Christian"];

let combinedArr = arr1.push(...arr2);
console.log(arr1);

וכמובן שנקבל מערך אחד מאוחד.

בהצלחה!

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


תגובה אחת בנושא “דרכים לאיחוד מערכים ב-JavaScript ועל ההבדלים ביניהן”

כתיבת תגובה

האימייל לא יוצג באתר. שדות החובה מסומנים *