Connect with us

קטגוריות

Javascript

לגזור ולשמור: 7 פעולות שימושיות שניתן לבצע על מערכים

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

הפעם החלטתי לרשום מאמר שיראה איך לבצע 7 פעולות על מערכים ב-Javascript בצורה פשוטה ובעזרת פונקציות שימושיות, מוכנים? התחלנו.

הסרת כפילויות ממערך

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

  • שימוש בפונקציה from
  • שימוש באופטור spread (…)

שימו לב: בשתי השיטות אנחנו עושים שימוש בפונקצייה Set.

var fruits = ['banana', 'apple', 'orange', 'watermelon', 'apple', 'orange', 'grape', 'apple'];


// First method
var uniqueFruits = Array.from(new Set(fruits));
console.log(uniqueFruits); // returns ['banana', 'apple', 'orange', 'watermelon', 'grape']
// Second method
var uniqueFruits2 = [...new Set(fruits)];
console.log(uniqueFruits2); // returns ['banana', 'apple', 'orange', 'watermelon', 'grape']


החלפת ערך במיקום ספציפי

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

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

var fruits = ['banana', 'apple', 'orange', 'watermelon', 'apple', 'orange', 'grape', 'apple'];
fruits.splice(0, 2, 'potato', 'tomato');
console.log(fruits); // returns ['potato', 'tomato', 'orange', 'watermelon', 'apple', 'orange', 'grape', 'apple']
3. Map array without .map()
Probably everyone knows .map() method of arrays, but there is a different solution which may be used to get a similar effect and very clean code as well. We can user .from() method for this purpose.

var friends = [
    { name: 'John', age: 22 },
    { name: 'Peter', age: 23 },
    { name: 'Mark', age: 24 },
    { name: 'Maria', age: 22 },
    { name: 'Monica', age: 21 },
    { name: 'Martha', age: 19 },
]


var friendsNames = Array.from(friends, ({name}) => name);
console.log(friendsNames); // returns ['John', 'Peter', 'Mark', 'Maria', 'Monica', 'Martha']


הפיכת מערך לאובייקט

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

var fruits = ['banana', 'apple', 'orange', 'watermelon'];
var fruitsObj = { ...fruits };
console.log(fruitsObj); // returns {0: 'banana', 1: 'apple', 2: 'orange', 3: 'watermelon', 4: 'apple', 5: 'orange', 6: 'grape', 7: 'apple'}


מציאת ערכים משותפים בין שני מערכים

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

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

לבסוף אנחנו נקבל מערך של ערכים משותפים, מגניב לא?

var numOne = [0, 2, 4, 6, 8, 8];
var numTwo = [1, 2, 3, 4, 5, 6];
var duplicatedValues = [...new Set(numOne)].filter(item => numTwo.includes(item));
console.log(duplicatedValues); // returns [2, 4, 6]


הסרת ערכים שלילים ממערך

ישנה שיטה סופר שימושית על מנת להסיר ערכים שלילים ממערך.

תחילה נגדיר ערכים שלילים במערך (false, 0, ", null, NaN, undefined) בשלב הבא אנחנו נשתמש בפונקציית filter עם טוויסט קטן – Boolean על מנת לפלטר את הערכים השלילים.

var mixedArr = [0, 'blue', '', NaN, 9, true, undefined, 'white', false];
var trueArr = mixedArr.filter(Boolean);
console.log(trueArr); // returns ['blue', 9, true, 'white']


שליפת ערך רנדומלי ממערך

אם במקרה אתם צריכים לשלוף ערך רנדומלי ממערך (כי זה מגניב 🤘), יש שיטה מהירה ונקייה לעשות זאת שמאפשרת לנו לשלוף את הערך בצורה רנדומלית בעזרת אורך המערך ושימוש בפונקציות כמו floor ו-random שנמצאות תחת Math.

var colors = ['blue', 'white', 'green', 'navy', 'pink', 'purple', 'orange', 'yellow', 'black', 'brown'];
var randomColor = colors[(Math.floor(Math.random() * (colors.length + 1)))]


לסכום את הערכים במערך

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

פונקציית reduce מקבלת שני פרמטרים, הראשון הוא פונקציית callback והשני הוא הערך ההתחלתי, פונקציית ה-reduce תדאג להעביר לפונקציית ה-callback שני פרמטרים שהראשון יהיה הערך ההתחלתי או אם היא כבר ביצעה איטרציה (על פי האקדמיה ללשון העברית: "חִזְרוּר" 🤘) אחת או יותר – את תוצאת הסכימה' והפרמטר השני הוא הערך הנוכחי במערך.

var nums = [1, 5, 2, 6];
var sum = nums.reduce((x, y) => x + y, 0);
console.log(sum); // returns 14

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

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

עוד ב Javascript

Meni Edri היי אני מני, מתכנת מנוסה ומאוד אוהב קוד ואת עולם התכנות, הקמתי את CodeHub על מנת שתיהיה לי פינה שבה אוכל לכתוב, ללמד וללמוד, מקווה שתימצאו את הבלוג הזה שימושי.
קריאה מהנה.

מאמרים פופולריים

נושאים פופולריים

חזרה למעלה