JavaScript - reduceRight() method

revision:


Category : array

The reduceRight() method applies a function against an accumulator and each value of the array (from right-to-left) in order to to reduce it to a single value.

The reduceRight() method executes a reducer function for each array element. It works from right to left and returns a single value: the function's accumulated result. The method does not execute the function for empty elements.

Syntax :

        reduceRight(callbackFn)
        reduceRight(callbackFn, initialValue)
        array.reduceRight(function(total, currentValue, currentIndex, arr), initialValue)
    

Parameters:

callbackFn, function : required; a function to execute for each element in the array. Its return value becomes the value of the accumulator parameter on the next invocation of callbackFn. For the last invocation, the return value becomes the return value of reduceRight(). The function is called with the following arguments:

accumulator, total : required; the value resulting from the previous call to callbackFn. On first call, "initialValue" if specified, otherwise the array's last element's value.
currentValue : required; the current element being processed in the array.
currentIndex : optional; the index of the current element being processed in the array.
array, arr : the array reduceRight() was called upon.

initialValue : optional. Value to use as accumulator to the first call of the "callbackFn". If no initial value is supplied, the last element in the array will be used and skipped. Calling "reduceRight()"" on an empty array without an initial value creates a "TypeError".

Examples:

            const array1 = [[0, 1], [2, 3], [4, 5]];
            const result = array1.reduceRight((accumulator, currentValue) => accumulator.concat(currentValue));
            console.log(result);
            // Expected output: Array [4, 5, 2, 3, 0, 1]
        

Practical examples

example: use reduceRight() method to return the difference of all array elements from the right.

code:
                    
<p id="reduce-1"></p> <p id="reduce-2"></p> </div> <script> let arr = [10, 20, 30, 40, 50, 60]; document.getElementById("reduce-1").innerHTML = "array : " + arr; function subofArray(total, num) { return total - num; } function myFun(item) { console.log(arr.reduceRight(subofArray)); document.getElementById("reduce-2").innerHTML = "difference counting from the right : " + arr.reduceRight(subofArray); } myFun(); </script>

example: use reduceRight() method to return the round sum of all array elements.

code:
                    <div>
                        <p id="reduce-3"></p>
                        <p id="reduce-4"></p>
                    </div>
                    <script>
                        let arr1 = [1.5, 20.3, 11.1, 40.7];
                        document.getElementById("reduce-3").innerHTML = "array : " + arr1;
                        function sumofArray(sum, num) {
                            return sum + Math.round(num);
                        }
                        function myFun2(item) {
                            console.log(arr1.reduceRight(sumofArray, 0));
                            document.getElementById("reduce-4").innerHTML = "round sum of all array elements : " + arr1.reduceRight(sumofArray, 0);
                        }
                        myFun2();
                    </script>
                

example: use the reduceRight() method for substraction and sum.

Subtract the numbers in the array, starting from the right:

Compute the result from subtracting the numbers in the array right-to-left.

code:
                    <div>
                        <p>Subtract the numbers in the array, starting from the right:</p>
                        <p id="reduce-5"></p>
                        <p id="reduce-6"></p>
                        <p>Compute the result from subtracting the numbers in the array right-to-left.</p>
                        <p id="reduce-7"></p>
                        <p id="reduce-8"></p>
                    </div>
                    <script>
                        const numbers = [175, 50, 25];
                        document.getElementById("reduce-5").innerHTML = "array : " + numbers;
                        document.getElementById("reduce-6").innerHTML = "total : " + numbers.reduceRight(myFun3);
                        function myFun3(total, num) {
                            return total - num;
                        }
            
                        const numbers1 = [2, 45, 30, 100];
                        document.getElementById("reduce-7").innerHTML = "array : " + numbers1;
                        document.getElementById("reduce-8").innerHTML = "total : " + numbers1.reduceRight(getSum);
                        function getSum(total, num) {
                            return total - num;
                        }
                    </script>