Создание моего собственного метода array.prototype.map.Как я могу получить доступ к массиву?

Question

Итак, я пытаюсь создать метод, который точно имитирует то, что делает метод Array.prototype.map(), и есть много вещей, в которых я запутался. Основная проблема, я полагаю, сводится к его синтаксису. Я знаю, что есть много разных способов использовать метод map, например:

пример 1:

допустим, у меня есть массив объектов -

var movieList = [
   {"Title" : "Inception",
   "Awards" : "4 oscars",
   "Language" : "English",
   "imdbRating" : "8.8"
   },

   {"Title" : "Inception2",
   "Awards" : "44 oscars",
   "Language" : "English and Spanish",
   "imdbRating" : "9.8"
   },

   {"Title" : "Interstellar",
   "Awards" : "10 oscars",
   "Language" : "English",
   "imdbRating" : "9.5"
   }
];

Допустим, я хочу создать функцию, которая возвращает список объектов, который содержит только название фильма и его imdbRating. В этом случае я могу использовать метод map():

let newList = movieList.map( (current) ({'title': current['Title'],     
               'rating': current['imdbRating'] }) );

приведенная выше строка кода удовлетворяет тому, что мне нужно для достижения моей цели с помощью метода map. Тем не менее, синтаксис может быть другим для других случаев

пример 2:

let s = [1, 2, 3, 4];

let s2 = s.map( function(item) {
   return item*2;
});

использование функции карты s2 вернет массив, который для каждого элемента удваивает значение каждого элемента в массиве s. Теперь, возвращаясь к теме этого поста, проблема, над которой я работаю, дала мне набросок для начала:

Array.prototype.myMap = function(callback) {
   let newArray = [];

Я понимаю, что когда массив вызывает метод myMap, он вставляет 2 аргумента: массив и функцию. Но я не могу понять, как конкретно назначить значение каждой функции обратного вызова в элементе для newArray в методе myMap. Тем более, что я не знаю, как получить доступ к исходному массиву.

Одна из моих попыток, которую я знаю, смешна, потому что я не знаю, как получить доступ к длине массива, а также к самому массиву, который вызывает метод myMap -

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

То, как я до сих пор понимал метод map(), состоит в том, что он принимает 3 аргумента, массив, функцию и элемент, который будет помещен через функцию, и я недостаточно хорошо знаю синтаксис для итерации За массив, который вызывает метод map, и нигде в моем курсе меня не учили, как это сделать, и я не нашел ни одного онлайн-ресурса, который бы предлагал решение этой проблемы.

Answer 1

length это не метод - это просто свойство.И вам нужно передать this[i] на callback для правильного вывода.

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

let arr = [1, 2, 3];
arr = arr.myMap(e => e * 2);
console.log(arr);

Обратите внимание, что это довольно плохая практика - мутировать методы-прототипы и особенно создавать новые, когда существует идентичный метод.(map обладает всеми функциями myMap и более).

Answer 2

Это упрощенная версия фактического map Polyfill .Вам нужно получить length, используя this.length.И передать текущий элемент в цикле, его индекс и сам массив в качестве параметра в callback

Array.prototype.myMap = function(callback, thisArg) {
  const newArray = [];
  const length = this.length;

  for (let i = 0; i < length; i++) {
    let value = callback(this[i], i, this); // call with proper arguments
    newArray.push(value);
  }

  return newArray;
};

const arr = [1, 2, 3];

console.log(arr.myMap(a => a * 2))

Примечание: map метод также принимает thisArg в качестве параметра.Если вы хотите использовать это, вам нужно call callback с thisArg как this

callback.call(thisArg, this[i], i, this);

Answer 3

Вот рабочая версия вашей функции myMap.

Частью имитации этих методов, которая может сбить людей с толку, является то, как ключевое слово this работает в javascript.Вот статья MDN .

Array.prototype.myMap = function(callback, thisArg) {
  let newArray = [];
  let x = this.length;
  for(let i=0; i<x; i++){
    let counter = callback.call(thisArg, this[i], i, this);
    newArray.push(counter);
  }
  return newArray;
};

Answer 4

Здесь вы можете узнать больше о функции javascript map: https://www.w3schools.com/jsref/jsref_map.asp

Реализация метода карты на самом деле намного проще, чем вы думаете. Вот действительно простой пример, который будет делать именно то, что делает метод карты из https://www.w3schools.com/jsref/jsref_map.asp:

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

//tests
var numbers2 = [1, 4, 9];

var squareRoot = numbers2.myMap(function(num) {
    return Math.sqrt(num);
});

console.log(squareRoot); // [ 1, 2, 3 ]

Таким образом, метод map просто возвращает массив, значения которого отображаются на значения исходного массива, запустив указанную функцию, заданную в качестве аргумента для каждого из значений.

Примечание: Метод пропускает необязательный параметр исходной функции карты, который указывает, что будет this значением