JavaScript-ում map() մեթոդը՝ գործիք նոր զանգված ստեղծելու համար

JavaScript-ի զանգվածային մեթոդների շարքում map()-ը ամենահզորներից մեկն է։ Այն թույլ է տալիս անցնել զանգվածի բոլոր տարրերով և վերադարձնել նոր զանգված, որի յուրաքանչյուր տարրը ստացվել է սկզբնական զանգվածի տարրից՝ որոշ փոփոխությամբ։

Այս հոդվածում կսովորենք՝

• Ինչ է map-ը
• Ինչպես է աշխատում
• Ինչ է վերադարձնում
• Ինչով է տարբերվում forEach-ից
• Ինչպես գրել map զրոյից

---

Սինտաքս

    array.map(function(element, index, array) {
        // վերադարձվող արժեքը կլինի նոր զանգվածի տարր
    });

Պարամետրեր

• element – ընթացիկ տարրը
• index – ընթացիկ ինդեքսը
• array – ամբողջ զանգվածը

---

Պարզ օրինակ

    const numbers = [1, 2, 3];

    const doubled = numbers.map(function(num) {
      return num * 2;
    });
    
    console.log(doubled); // [2, 4, 6]

Նախնական զանգվածը չի փոփոխվում, իսկ վերադարձվում է նոր զանգված։

---

Տարբերությունը forEach-ի հետ

• forEach – օգտագործվում է գործողություն կատարելու համար
• map – օգտագործվում է նոր արժեքների զանգված ստեղծելու համար

    const nums = [1, 2, 3];

    const withForEach = [];
    nums.forEach(n => withForEach.push(n * 2));
    
    const withMap = nums.map(n => n * 2);
    
    console.log(withForEach); // [2, 4, 6]
    console.log(withMap);     // [2, 4, 6]

Երկուսն էլ անցնում են տարրերով, բայց map-ը ավտոմատ վերադարձնում է նոր զանգված, ինչը ավելի հարմար է։

---

Կարևոր մանրամասներ

• map-ը չի փոփոխում բնօրինակ զանգվածը։
• Վերադարձնում է նույն երկարությամբ նոր զանգված։
• Կարելի է կոմբինացնել այլ մեթոդների հետ՝ filter, reduce և այլն։

---

Իրական կիրառման օրինակ

    const users = [
      { name: 'Anna', age: 25 },
      { name: 'David', age: 30 },
      { name: 'Narek', age: 22 },
    ];
    
    const names = users.map(user => user.name);
    console.log(names); // ['Anna', 'David', 'Narek']

---

Ինչպես է աշխատում map() մեթոդը ներքուստ

Ինչպես և forEach, map-ը մեթոդ է, որը կապված է Array.prototype-ին։

Երբ գրում ենք՝

    [1, 2, 3].map(fn);

Սա նույնն է ինչ՝

    Array.prototype.map.call([1, 2, 3], fn);

---

Գրենք մեր սեփական myMap() ֆունկցիան

    function myMap(array, callback) {
      const result = [];
    
      for (let i = 0; i < array.length; i++) {
        result.push(callback(array[i], i, array));
      }
    
      return result;
    }

Օգտագործում ենք՝

    const nums = [1, 2, 3];

    const doubled = myMap(nums, function(num) {
      return num * 2;
    });
    
    console.log(doubled); // [2, 4, 6]

---

Կարող ենք ավելացնել զանգվածի վրա (ուսումնական նպատակով)

    Array.prototype.myMap = function(callback) {
      const result = [];
    
      for (let i = 0; i < this.length; i++) {
        result.push(callback(this[i], i, this));
      }
    
      return result;
    };

Օգտագործում ենք այսպես՝

    const names = ['anna', 'david'].myMap(name => name.toUpperCase());
    console.log(names); // ['ANNA', 'DAVID']

Հիշեցում․ պրոդաքշն միջավայրում խորհուրդ չի տրվում փոփոխել ներկառուցված պրոտոտիպերը։