מדריך מקיף למערכים ב- JavaScript: מתודות ודוגמאות

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

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

מבוא למערכים ב- JavaScript

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

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

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

1. כיצד ליצור מערך ב- JavaScript?

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

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];

console.log(cars);
// ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche']

2. כיצד לבדוק את מספר הפריטים במערך?

ניתן להשתמש במאפיין length כדי לבדוק את מספר הפריטים במערך.

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];

console.log(cars.length);
// 8

3. כיצד לגשת לפריטים במערך לפי מספר אינדקס?

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

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];

console.log(cars[0]);
// Tesla

console.log(cars[4]);
// Ford

4. כיצד לגשת לפריט האחרון במערך?

לגישה לפריט האחרון במערך ניתן להשתמש במאפיין length ולחסר ממנו 1.

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];

console.log(cars[cars.length - 1]);
// Porsche

עבודה עם מערכים ב- JavaScript

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

5. כיצד לרוץ עם לולאה על מערך?

המתודה forEach היא דרך מודרנית ונוחה לעבור על כל פריטי המערך ולבצע פעולות על כל אחד מהם.

var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford', 'Hyundai', 'Nissan', 'Porsche'];

cars.forEach(function(arrayItem, index) {
  console.log(arrayItem, index);
});

// Tesla 0
// Toyota 1
// BMW 2

למדו עוד על חיפוש במערכים בפוסט כיצד לבדוק אם ערך קיים במערך באמצעות Js או jQuery.

6. כיצד להוסיף פריט לתחילת המערך?

המתודה unshift מאפשרת להוסיף פריט חדש לתחילת המערך.

var cars = ['Tesla', 'Toyota', 'BMW'];

cars.unshift('Mercedes');
console.log(cars);
// ['Mercedes', 'Tesla', 'Toyota', 'BMW']

7. כיצד להסיר פריט מתחילת המערך?

כדי להסיר פריט מתחילת המערך, נשתמש במתודה shift.

var cars = ['Tesla', 'Toyota', 'BMW'];

cars.shift();
console.log(cars);
// ['Toyota', 'BMW']

8. כיצד למצוא את האינדקס של פריט במערך?

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

var cars = ['Tesla', 'Toyota', 'BMW'];

console.log(cars.indexOf('BMW'));
// 2

מתודות מתקדמות לעבודה עם מערכים

בנוסף למתודות הבסיסיות, קיימות מתודות מתקדמות יותר כמו map, filter ו-find, המאפשרות עיבוד מתקדם של הנתונים במערך.

9. כיצד להוסיף ולהסיר פריטים מסוף המערך?

כדי להוסיף פריט לסוף המערך, נשתמש במתודה push, ולהסרת הפריט האחרון נשתמש במתודה pop.

var cars = ['Tesla', 'Toyota'];

cars.push('BMW');
console.log(cars);
// ['Tesla', 'Toyota', 'BMW']

cars.pop();
console.log(cars);
// ['Tesla', 'Toyota']

10. כיצד לשלב שני מערכים?

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

var cars = ['Tesla', 'Toyota'];
var moreCars = ['Ford', 'BMW'];

var combined = cars.concat(moreCars);
console.log(combined);
// ['Tesla', 'Toyota', 'Ford', 'BMW']

11. כיצד להשתמש ב-map לשינוי מערך?

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

var numbers = [1, 2, 3];

var doubled = numbers.map(function(num) {
  return num * 2;
});

console.log(doubled);
// [2, 4, 6]

12. כיצד לסנן פריטים במערך?

המתודה filter יוצרת מערך חדש עם הפריטים שעוברים תנאי מסוים.

var cars = ['Tesla', 'Toyota', 'BMW'];

var filtered = cars.filter(function(car) {
  return car.startsWith('T');
});

console.log(filtered);
// ['Tesla', 'Toyota']

13. כיצד לבדוק אם מערך כולל ערך?

המתודה includes בודקת אם פריט מסוים קיים במערך ומחזירה ערך בוליאני.

var cars = ['Tesla', 'Toyota'];

console.log(cars.includes('Toyota'));
// true

console.log(cars.includes('BMW'));
// false

14. כיצד למצוא את הפריט הראשון שעונה על תנאי?

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

var cars = ['Tesla', 'Toyota', 'BMW'];

var found = cars.find(function(car) {
  return car.startsWith('T');
});

console.log(found);
// 'Tesla'

לסיכום

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

מעבר למתודות שהוצגו, קיימות עוד מתודות רבות כמו reduce לעיבוד מצטבר של נתונים ו-sort למיון מערכים. הבנה מעמיקה של מערכים ומתודותיהם תסייע לכם לכתוב קוד נקי, יעיל וקל יותר לתחזוקה.

למידע נוסף, בקרו ב-MDN Web Docs.