Here are five important polyfills in javascript. I will be covering
forEach,map,filter,reduce,flatin the easiest way possible.
NOTE : Knowledge of the This keyword is crucial.
Let's get started!
forEach
The code below is a simple example of forEach.
const numbers = [1, 2, 3, 4, 5] const ans = numbers.forEach((n) => console.log(n)) polyfill of forEach
const numbers = [1, 2, 3, 4, 5] Array.prototype.myForEach = function (callbackfn) { for (let index = 0; index < this.length; index++) { callbackfn(this[index], index, this) } } numbers.myForEach((n) => console.log(n)) map
Simple example of in-built mapfunction
const numbers = [1, 2, 3, 4, 5] console.log(numbers.map((n) => n * 2)); Here is polyfill of map
const numbers = [1, 2, 3, 4, 5] Array.prototype.myMap = function myMap(cb) { const output = [] for (let i = 0; i < this.length; i++) { let a = cb(this[i]) output.push(a) } return output } console.log(numbers.myMap((n) => n * 2)); filter
Here is filterexample
const numbers = [1, 2, 3, 4, 5] console.log(numbers.filter((n) => n > 3)); Polyfill of filter
const numbers = [1, 2, 3, 4, 5] Array.prototype.myFilter = function (cb) { const output = [] for (let i = 0; i < this.length; i++) { if (cb(this[i])) { output.push(this[i]) } } return output } console.log(numbers.myFilter((n) => n > 4)); reduce
example of reducemethod
const numbers = [1, 2, 3, 4, 5] console.log(numbers.reduce((acc, curr) => { return acc + curr }, 0) ); polyfill of reduce
const numbers = [1, 2, 3, 4, 5] Array.prototype.myReduce = function (cb, initialValue) { let acc = initialValue; for (let i = 0; i < this.length; i++) { acc = acc ? cb(acc, this[i]) : this[i] } return acc } console.log(numbers.myReduce((acc, curr) => { return acc + curr }, 1)); flat
Example of flatmethod, it takes depth as an argument. Depth refers to how deeply nested arrays within the original array should be flattened.
const numbers = [1, [2, [3, 4]]] console.log(numbers.flat(2)); polyfill of flat
const numbers = [1, [2, [3, 4]]] Array.prototype.myflat = function (depth) { const output = [] if (!Array.isArray(this)) { throw new Error(`${this}.flat is not a function`); } this.forEach((n) => { if (Array.isArray(n) && depth > 0) { output.push(...n.myflat(depth - 1)) } else { output.push(n) } }); return output } console.log(numbers.myflat(2)); 
Top comments (0)