Maison > interface Web > js tutoriel > Polyfill pour les méthodes Map, Filter et Reduction en Javascript

Polyfill pour les méthodes Map, Filter et Reduction en Javascript

王林
Libérer: 2024-08-16 06:18:12
original
744 Les gens l'ont consulté

Polyfill for Map, Filter, and Reduce Methods in Javascript

Carte

Il renvoie un nouveau tableau à partir du tableau d'origine, en effectuant certaines opérations (fonction de rappel) sur chaque élément du tableau. Cela ne modifie pas le tableau d'origine.

const nums = [1, 2, 3, 4];

const double = nums.map((num, i, arr) => num * 2);
console.log(double); // [2, 4, 6, 8]
Copier après la connexion

Mise en œuvre

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

Copier après la connexion

Filtre

Il renvoie un nouveau tableau contenant uniquement les éléments qui satisfont à la condition donnée (c'est-à-dire pour lesquels le rappel renvoie vrai). Le tableau d'origine reste inchangé.

const nums= [1, 2, 3, 4];

const greaterThan2 = nums.filter((num, i, arr) => num > 2);
console.log(greaterThan2); // [3, 4]
Copier après la connexion

Mise en œuvre

Array.prototype.myFilter = function (cb) {
  let output = [];
  for (let i = 0; i < this.length; ++i) {
    if (cb(this[i], i, this)) output.push(this[i]);
  }
  return output;
};
Copier après la connexion

Réduire

C'est probablement le plus compliqué des trois. Cette méthode traite les éléments d’un tableau pour produire une valeur de sortie unique.

const nums = [1, 2, 3, 4];

const sum = nums.reduce((acc, num) => acc + num, 0);

console.log(sum); // 10
Copier après la connexion

Mise en œuvre

Array.prototype.myReduce = function (cb, initialValue) {
  let accumulator = initialValue;
  for (let i = 0; i < this.length; ++i) {
    accumulator = accumulator!== undefined ? cb(accumulator, this[i], i, this) : this[i];
  }
  return accumulator;
};
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal