Предварительная реализация полифилла для метода Array map: вы не знали об этом раньше

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

Синтаксис метода карты: Array.prototype.map(callbackFn, thisArg);

Перед реализацией полифилла карты уясните, пожалуйста, this keyword. this keyword будет ссылаться на объект, для которого он был вызван. Вы можете прочитать об этом здесь".

Давайте построим полифил шаг за шагом.

Шаг 1:

Array.prototype.myMap = function(callbackFn, thisValue) {
  let outputArr = [];
  for(let i = 0; i < this.length; i++) {
    outputArr[i] = callbackFn(this[i], i, this);
  }
  return outputArr;
}

Здесь мы перебираем каждый элемент переданного массива. this keyword относится к массиву, из которого мы вызвали метод. В callbackFn мы получаем текущее значение, индекс и весь массив, откуда был вызван метод.

Шаг 2:

Array.prototype.myMap = function(callbackFn, thisValue) {
  let outputArr = new Array(this.length);
  for(let i = 0; i < outputArr.length; i++) {
    outputArr[i] = callbackFn(this[i], i, this);
  }
  return outputArr;
}

Когда мы создаем массив вида arr = []. Он внутренне создан как,

arr = new Array(), чтобы создать новый экземпляр массива. В методе карты размер массива уже определен до вызова функции обратного вызова, поэтому мы сделали выходной массив того же размера, что и входной массив.

Шаг 3.

Array.prototype.myMap = function(callbackFn, thisValue) {
  let outputArr = new Array(this.length);
  for(let i = 0; i < outputArr.length; i++) {
    if(this[i])
      outputArr[i] = callbackFn(this[i], i, this);
  }
  return outputArr;
}

Метод карты не будет вызываться для пустых слотов, присутствующих в разреженном массиве. Таким образом, мы должны опустить пустые значения.

Шаг 4:

Array.prototype.myMap = function(callbackFn, thisValue = window) {
  let outputArr = new Array(this.length);
    for(let i = 0; i < outputArr.length; i++) {
     if(this[i])
      outputArr[i] = callbackFn.call(thisValue, this[i], i, this);
    }
  return outputArr;
}

По умолчанию значение this keyword будет объектом окна в нестрогом режиме, а в строгом режиме оно не определено. Таким образом, если this keyword не передается, мы должны сделать его объектом окна по умолчанию (для нестрогого режима).
Если в функции обратного вызова используется это ключевое слово, то this keyword должно ссылаться на переданное thisValue при вызове метода карты, т. е. arr1.map(callbackFn, arr2);

arr2 = [2,3,4]
arr1.map(function() {console.log(this)}, arr2)  //  [2,3,4] => output

Здесь передано это значение arr2. (только для использования this keyword в callbackFn)

Поэтому для этого мы должны использовать метод call для изменения ссылки на this keyword.

Вот и все!! Мы успешно реализовали полифилл для метода карты массива.

Надеюсь, вам понравилось. Дайте мне знать в комментариях, хотите ли вы того же для метода привязки метода сокращения.