JS Polyfills - Part 2 (forEach, keys, Values, Entries)
Tags: javascript, webdev, jsitor, jspolyfill
Published: 2022-10-22 09:19:01

<link rel="canonical" href="https://dev.to/uttarasriya/js-polyfills-part-2-307d"/>
**Github Code:** [JS Polyfills](https://github.com/uttara-sriya/JS-Polyfills)
**4. forEach()**

- <u>Function</u>: `forEach(callback, thisArg)`
- <u>Usage</u>: `arr.forEach((ele, index, arr)=>{...}, this)`
- <u>Description</u>: callback function will execute on every element. But not for uninitialized elements for sparse arrays.
- <u>Polyfill</u>: [forEach](https://jsitor.com/C42UCNGj9)

```javascript
//function returns undefined
Function.prototype.customForEach = function (callback) {
  //this should point to array
  if(Array.isArray(this)) {
    for (let i = 0; i < this.length; i++) {
      //check if each element exists
      if(typeof this[i] !== 'undefined') {
        //callback will take element, index and array as parameters
        callback(this[i], i, this);
      }
    }
  }
};

```
**5. Keys()**

- <u>Function</u>: `keys(obj)`
- <u>Usage</u>: `Obj.keys(anyobj)`
- <u>Description</u>: returns array iterator
- <u>Polyfill</u>:[Keys](https://jsitor.com/uvUwSV8D1)
```javascript
//function returns Array Iterator
Array.prototype.customKeys = function () {
  let keys = [];
    for (let i = 0; i < this.length; i++) {
      keys.push(i);
    }
    // A generator function which returns a generator object( basically follows iterator protocol)
    // Why we use here? because the keys return array iterator
    // A yield will pause and resume the function (Basically will return the keys one by one until done becomes true)
    function* iterator() {
      yield* keys;
    }

    return iterator();
};
```
**6. Values()**

- <u>Function</u>: `values(obj)`
- <u>Usage</u>: `Obj.values(anyobj)`
- <u>Description</u>: returns array iterator
- <u>Polyfill</u>:[Values](https://jsitor.com/kU-55C-wc)
```javascript
//function returns Array Iterator
Array.prototype.customValues = function () {
  let values = [];
    for (let i = 0; i < this.length; i++) {
      values.push(this[i]);
    }
    // A generator function which returns a generator object( basically follows iterator protocol)
    // Why we use here? because the values return array iterator
    // A yield will pause and resume the function (Basically will return the values one by one until done becomes true)
    function* iterator() {
      yield* values;
    }

    return iterator();
};
```
**7. Entries()**

- <u>Function</u>: `entries(obj)`
- <u>Usage</u>: `Obj.entries(anyobj)`
- <u>Description</u>: returns array iterator
- <u>Polyfill</u>:[Entries](https://jsitor.com/S865hAWaa)
```javascript
//function returns Array Iterator
Array.prototype.customEntries = function () {
  let entries = [];
    for (let i = 0; i < this.length; i++) {
      entries.push(i, this[i]);
    }
    // A generator function which returns a generator object( basically follows iterator protocol)
    // Why we use here? because the entries return array iterator
    // A yield will pause and resume the function (Basically will return the entries one by one until done becomes true)
    function* iterator() {
      yield* entries;
    }

    return iterator();
};
```

Stay Tuned for Part 3
Keep Learning!