בואו נבהיר את הבלבול סביב השיטות slice (), splice (), ו- split () ב- JavaScript

תִכנוּת

שיטות מובנות ב- JavaScript עוזרות לנו מאוד בזמן התכנות, ברגע שאנחנו מבינים אותן נכון. ברצוני להסביר שלושה מהם במאמר זה: slice(), splice()ואת split()השיטות. אולי בגלל שמותם כל כך דומה הם לעתים קרובות מבולבלים, אפילו בקרב מפתחים מנוסים.

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

בסופו של דבר תוכלו למצוא סיכום של כל שיטה. אם אתה מעדיף, תוכל גם לצפות בגרסת הווידיאו למטה:

אז הבה נתחיל…

מערכי JavaScript

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

לפעמים אנחנו צריכים לבצע פעולות במערכים האלה. לאחר מכן אנו משתמשים בכמה שיטות JS כמו slice () & splice () . תוכל לראות בהמשך כיצד להכריז על מערך ב- JavaScript:

let arrayDefinition = [];   // Array declaration in JS

עכשיו בואו נכריז על מערך נוסף עם סוגי נתונים שונים. אשתמש בהמשך בדוגמאות:

let array = [1, 2, 3, "hello world", 4.12, true];

שימוש זה תקף ב- JavaScript. מערך עם סוגי נתונים שונים: מחרוזת, מספרים ובוליאני.

פרוסה ( )

פרוסה () שיטת עותקי חלק נתון של מערך ומחזיר כי הועתק חלק כמערך חדש. זה לא משנה את המערך המקורי.

array.slice(from, until);

  • מאת: פורסים את המערך החל מ מדד אלמנט
  • עד: פורסים את המערך עד לאינדקס אלמנטים אחר

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

array.slice(0, until);

עכשיו הנה החלק המסובך. כשאני רוצה לחתוך את שלושת האלמנטים הראשונים, עלי לתת את הפרמטר עד כ -3 . השיטה slice () אינה כוללת את האלמנט האחרון.

array[0] --> 1 // included array[1] --> 2 // included array[2] --> 3 // included array[3] --> "hello world" // not included

זה יכול ליצור קצת בלבול. לכן אני קורא לפרמטר השני "עד".

let newArray = array.slice(0, 3);   // Return value is also an array

לבסוף, אני מקצה את מערך הפרוסים למשתנה newArray . עכשיו בואו נראה את התוצאה:

הערה חשובה: ניתן להשתמש בשיטת Slice () גם למחרוזות.

אחוי ()

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

הסרת אלמנטים

להסרת אלמנטים, עלינו לתת את פרמטר האינדקס ואת מספר האלמנטים שיש להסיר:

array.splice(index, number of elements);

אינדקס הוא נקודת המוצא להסרת אלמנטים. אלמנטים שיש להםמספר אינדקס קטן יותר מהאינדקס הנתון לא יוסרו:

array.splice(2);  // Every element starting from index 2, will be removed

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

כדוגמה שנייה, אני נותן את הפרמטר השני כ- 1, כך שאלמנטים המתחילים מאינדקס 2 יוסרו בזה אחר זה בכל פעם שאנחנו קוראים לשיטת splice () :

array.splice(2, 1);

לאחר השיחה הראשונה:

לאחר שיחה שנייה:

זה יכול להימשך עד שאין עוד אינדקס 2.

הוספת אלמנטים

להוספת אלמנטים, עלינו לתת אותם כפרמטר השלישי, הרביעי, החמישי (תלוי כמה להוסיף) לשיטת splice () :

array.splice (אינדקס, מספר אלמנטים, אלמנט, אלמנט);

כדוגמה, אני מוסיף a ו- b ממש בתחילת המערך ולא מסיר דבר:

array.splice(0, 0, 'a', 'b');

פיצול ()

שיטות Slice () ו- splice () מיועדות למערכים. שיטת הפיצול () משמשת למיתרים . הוא מחלק מחרוזת למיתרים ומחזיר אותם כמערך. זה לוקח 2 פרמטרים, ושניהם אופציונליים.

string.split(separator, limit);

  • מפריד: מגדיר כיצד לפצל מחרוזת ... על ידי פסיק, תו וכו '.
  • מגבלה: מגביל את מספר הפיצולים עם מספר נתון

שיטת split () אינה פועלת ישירות למערכים . עם זאת, תחילה נוכל להמיר את האלמנטים של המערך שלנו למחרוזת, ואז נוכל להשתמש בשיטת split () .

בואו נראה איך זה עובד.

ראשית, אנו ממירים את המערך שלנו למחרוזת בשיטת toString () :

let myString = array.toString();

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

let newArray = myString.split(",", 3);

כפי שאנו רואים, myString מחולק לפי פסיקים. מכיוון שאנחנו מגבילים את הפיצול ל -3, רק 3 האלמנטים הראשונים מוחזרים.

הערה: אם יש לנו שימוש כזה:array.split("");כל תו של המחרוזת יחולק כמתחים:

סיכום:

פרוסה ( )

  • מעתיק אלמנטים ממערך
  • מחזיר אותם כמערך חדש
  • לא משנה את המערך המקורי
  • מתחיל חיתוך מ ... עד אינדקס נתון: array.slice (מ, עד)
  • פרוסה אינה כוללת פרמטר אינדקס "עד"
  • יכול לשמש גם למערכים וגם למיתרים

אחוי ()

  • משמש להוספה / הסרה של אלמנטים ממערך
  • מחזירה מערך של אלמנטים שהוסרו
  • משנה את המערך
  • להוספת אלמנטים: array.splice (אינדקס, מספר אלמנטים, אלמנט)
  • להסרת אלמנטים: array.splice (אינדקס, מספר אלמנטים)
  • יכול לשמש רק למערכים

פיצול ()

  • מחלק מחרוזת למתחים
  • מחזיר אותם במערך
  • לוקח 2 פרמטרים, שניהם אופציונליים: string.split (מפריד, מגבלה)
  • לא משנה את המחרוזת המקורית
  • ניתן להשתמש רק בחוטים

ישנן שיטות מובנות רבות אחרות למערכי מחרוזות ומחרוזות JavaScript, אשר מקלות על העבודה עם תכנות JavaScript. לאחר מכן, תוכלו לבדוק את המאמר החדש שלי על שיטות Substring של JavaScript.

אם אתה רוצה ללמוד עוד על פיתוח אתרים, אל תהסס לעקוב אחרי ב- Youtube !

תודה שקראת!