JavaScript Array reduce() Method

01 Nov, 2021
Below is the example of Array reduce() method.
Example:<!DOCTYPE html><html>      <head>    <title>        JavaScript Array reduce() Method    </title></head>  <body style="text-align:center;">          <h1 style="color: green;">GeeksforGeeks</h1>          <p>        Click here to get the Subtract        of array elements from the left side    </p>          <button onclick="myGeeks()">        Click Here!    </button>          <br><br>          Subtract: <span id="GFG"></span>          <!-- Script to use reduce method -->    <script>        var arr = [175, 50, 25];          function subofArray(total, num) {            return total - num;        }        function myGeeks(item) {            document.getElementById("GFG").innerHTML                    = arr.reduce(subofArray);        }    </script></body>  </html>          
<!DOCTYPE html><html>      <head>    <title>        JavaScript Array reduce() Method    </title></head>  <body style="text-align:center;">          <h1 style="color: green;">GeeksforGeeks</h1>          <p>        Click here to get the Subtract        of array elements from the left side    </p>          <button onclick="myGeeks()">        Click Here!    </button>          <br><br>          Subtract: <span id="GFG"></span>          <!-- Script to use reduce method -->    <script>        var arr = [175, 50, 25];          function subofArray(total, num) {            return total - num;        }        function myGeeks(item) {            document.getElementById("GFG").innerHTML                    = arr.reduce(subofArray);        }    </script></body>  </html>          
Output:
The arr.reduce() method in JavaScript is used to reduce the array to a single value and executes a provided function for each value of the array (from left-to-right) and the return value of the function is stored in an accumulator.
Syntax:
array.reduce( function(total, currentValue, currentIndex, arr), 
initialValue )
Parameter: This method accepts five parameters as mentioned above and described below:
function(total, currentValue, index, arr): It is the required parameter and used to run for each element of array. It contains four parameter which are listed below:total: It is required parameter and used to specify the initialValue, or the previously returned value of the function.currentValue: It is required parameter and used to specify the value of the current element.currentIndex: It is optional parameter and used to specify the array index of the current element.arr: It is optional parameter and used to specify the array object the current element belongs to.
total: It is required parameter and used to specify the initialValue, or the previously returned value of the function.
currentValue: It is required parameter and used to specify the value of the current element.
currentIndex: It is optional parameter and used to specify the array index of the current element.
arr: It is optional parameter and used to specify the array object the current element belongs to.
initialValue: It is optional parameter and used to specify the value to be passed to the function as the initial value.
Example 1: This example use reduce() method to return the sum of all array elements.
<!DOCTYPE html><html>      <head>    <title>        JavaScript Array reduce() Method    </title></head>  <body style="text-align:center;">          <h1 style="color: green;">GeeksforGeeks</h1>          <p>        Click here to get the sum        of array elements    </p>          <button onclick="myGeeks()">        Click Here!    </button>          <br><br>          Sum: <span id="GFG"></span>          <!-- Script to use reduce method -->    <script>        var arr = [10, 20, 30, 40, 50, 60];           function sumofArray(sum, num) {            return sum + num;        }        function myGeeks(item) {            document.getElementById("GFG").innerHTML                    = arr.reduce(sumofArray);        }    </script></body>  </html>                    
Output:
Example 2: This example use reduce() method to return the round sum of all array elements.
<!DOCTYPE html><html>      <head>    <title>        JavaScript Array reduce() Method    </title></head>  <body style="text-align:center;">          <h1 style="color: green;">GeeksforGeeks</h1>          <p>        Click here to get the sum        of array elements    </p>          <button onclick="myGeeks()">        Click Here!    </button>          <br><br>          Sum: <span id="GFG"></span>          <!-- Script to use reduce method -->    <script>        var arr = [1.5, 20.3, 11.1, 40.7];           function sumofArray(sum, num) {            return sum + Math.round(num);        }        function myGeeks(item) {            document.getElementById("GFG").innerHTML                    = arr.reduce(sumofArray, 0);        }    </script></body>  </html>                    
Output:Supported Browsers: The browsers supported by JavaScript Array reduce() method are listed below:
Google Chrome 3 and above
Microsoft Edge 12 and above
Mozilla Firefox 3.0 and above
Safari 5 and above
Opera 10.5 and above
ysachin2314
javascript-array
JavaScript-Methods
Picked
JavaScript
Web Technologies
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.