¿Qué es un Polyfill?

Polyfill es una forma de modificar o agregar nuevas funciones. Es básicamente una pieza de código para agregar/modificar las nuevas funciones. Se utiliza para proporcionar una funcionalidad moderna a los navegadores web.

• Es básicamente una pieza de código para proporcionar una funcionalidad moderna a los navegadores web.
• Se utiliza para añadir/modificar nuevas funcionalidades.

Es como el respaldo del navegador, si su navegador no proporciona la función de mapa(), entonces deberá codificar su propia función de mapa(). Discutiremos los polyfills para los siguientes métodos:

• Usando mapa( )
• Usando paraCada( )
• Usando reduce()

Codificaremos nuestra propia función map(), forEach() y reduce(). Todas estas son funciones de orden superior que se definen dentro de Array.prototype para que sean accesibles para todas las arrays declaradas.

Para crear nuestro propio polyfill, debemos declararlos dentro del Array.prototype.

1. Polyfill para la función map()

Ejemplo: Nos han dado el arreglo y necesitamos multiplicar cada elemento por dos.

const arr = [1, 2, 3, 4, 5];
  
function callback(ele) {
    return ele * 2;
}
  
Array.prototype.myMap = function (callback) {
    const myArr = [];
    for (const i in this) {
        myArr.push(callback(this[i]));
    }
    return myArr;
};
  
const newArr = arr.myMap(callback);
for (i in newArr) {
    console.log(newArr[i]);
}

Producción:

2
4
6
8
10

2. Polyfill para la función forEach()

Ejemplo: crear nuestra propia función como la función forEach() en JavaScript.

const arr = [1, 2, 3, 4, 5];
  
function myFunction(ele) {
    console.log(ele);
}
  
Array.prototype.myForEach = function (callback) {
    for (const i in this) {
        callback(this[i]);
    }
};
  
arr.myForEach(myFunction);

Producción:

1
2
3
4
5

3. Polyfill para la función de reducción ( )

Ejemplo: encuentre la suma de todos los números pares dentro de la array dada.

const arr = [1, 2, 3, 4, 5, 6];
  
function callback(ele) {
    if (ele % 2 == 0) {
        return true;
    }
  
    return false;
}
  
Array.prototype.myReduce = function (callback, sum) {
    for (const i in this) {
        if (callback(this[i])) {
            sum += this[i];
        }
    }
    return sum;
};
  
const sum = arr.myReduce(callback, 0);
console.log(sum);

Producción:

12

Referencia: https://developer.mozilla.org/en-US/docs/Glossary/Polyfill