🔙 Array.prototype.findLast() Polyfill

jspolyfillsmedium

The findLast() method returns the last element in an array that satisfies a given predicate function. It iterates from the end of the array.

✅ Implementation

if (!Array.prototype.findLast) {
  Array.prototype.findLast = function(callback, thisArg) {
    // Ensure that 'callback' is a function
    if (typeof callback !== 'function') {
      throw new TypeError(callback + ' is not a function');
    }
    
    // Iterate over the array starting from the last element
    for (let i = this.length - 1; i >= 0; i--) {
      // If the element satisfies the condition, return it
      if (callback.call(thisArg, this[i], i, this)) {
        return this[i];
      }
    }
    
    // If no element satisfies the condition, return undefined
    return undefined;
  };
}

Explanation:

Check if findLast is defined: The if (!Array.prototype.findLast) condition ensures that the polyfill only runs if findLast is not already available.
Callback validation: It checks whether the callback provided is a valid function using typeof callback !== 'function'.
Iterate backward: The loop starts from the last element of the array (i = this.length - 1) and moves towards the first element (i--).
Calling the callback: callback.call(thisArg, this[i], i, this) is used to invoke the callback function. This gives you the correct value for this within the callback function, the current element (this[i]), its index (i), and the array itself (this).
Return the matching element: If the callback returns a truthy value, that element is returned as the result of findLast.
Return undefined if no match is found: If the loop completes without finding a match, undefined is returned.

Example Usage:

const arr = [1, 2, 3, 4, 5];

const result = arr.findLast(num => num % 2 === 0);
console.log(result); // Output: 4

In this example, findLast finds the last even number (4) in the array.

Edge Cases:

If no element matches the condition, it returns undefined.
If the array is empty, it returns undefined.

This implementation closely mimics the behavior of the modern findLast method that was introduced in newer versions of JavaScript.

Quick Quiz

Test your understanding with 3 quick questions

Q1What does `[1, 2, 3, 4, 5].findLast(num => num % 2 === 0)` return?

Q2How does `findLast()` differ from `find()`?

Q3What does `findLast()` return when no element matches?

✅ Implementation

if (!Array.prototype.findLast) {
  Array.prototype.findLast = function(callback, thisArg) {
    // Ensure that 'callback' is a function
    if (typeof callback !== 'function') {
      throw new TypeError(callback + ' is not a function');
    }
    
    // Iterate over the array starting from the last element
    for (let i = this.length - 1; i >= 0; i--) {
      // If the element satisfies the condition, return it
      if (callback.call(thisArg, this[i], i, this)) {
        return this[i];
      }
    }
    
    // If no element satisfies the condition, return undefined
    return undefined;
  };
}

Explanation:

Check if findLast is defined: The if (!Array.prototype.findLast) condition ensures that the polyfill only runs if findLast is not already available.

Callback validation: It checks whether the callback provided is a valid function using typeof callback !== 'function'.

Iterate backward: The loop starts from the last element of the array (i = this.length - 1) and moves towards the first element (i--).

Calling the callback: callback.call(thisArg, this[i], i, this) is used to invoke the callback function. This gives you the correct value for this within the callback function, the current element (this[i]), its index (i), and the array itself (this).

Return the matching element: If the callback returns a truthy value, that element is returned as the result of findLast.

Return undefined if no match is found: If the loop completes without finding a match, undefined is returned.

Example Usage:

const arr = [1, 2, 3, 4, 5];

const result = arr.findLast(num => num % 2 === 0);
console.log(result); // Output: 4

In this example, findLast finds the last even number (4) in the array.

Edge Cases:

If no element matches the condition, it returns undefined.

If the array is empty, it returns undefined.

This implementation closely mimics the behavior of the modern findLast method that was introduced in newer versions of JavaScript.

Quick Quiz

Test your understanding with 3 quick questions

Q1What does `[1, 2, 3, 4, 5].findLast(num => num % 2 === 0)` return?

Q2How does `findLast()` differ from `find()`?

Q3What does `findLast()` return when no element matches?

🔙 Array.prototype.findLast() Polyfill

✅ Implementation

Explanation:

Example Usage:

Edge Cases:

Continue Reading

🛑 AbortController: Canceling Async Operations in JavaScript

🔒 Closures in JavaScript — The Complete Guide

📦 Understanding ES6 Modules in JavaScript

🔙 Array.prototype.findLast() Polyfill

✅ Implementation

Explanation:

Example Usage:

Edge Cases:

Continue Reading

🛑 AbortController: Canceling Async Operations in JavaScript

🔒 Closures in JavaScript — The Complete Guide

📦 Understanding ES6 Modules in JavaScript