Open In App

Underscore.js _.reduce() Function

Improve
Improve
Like Article
Like
Save
Share
Report

Underscore.js _.reduce() function is an inbuilt function in Underscore.js that is used to transform an array’s/object’s properties into one single value or is used to create a single result from a given list of values. When all the elements of the list are passed to the function/iterate and no more elements remain then the _.each loop ends. The iterate function makes use of memorization, i.e. it remembers the return value each time it calculates a value. 

Syntax:

_.reduce(list, iteratee, memo);

Parameters:

  • List: It is the list containing some elements.
  • Iterate: It is the function that is used to take all the elements of the list and it also remembers all the returned values.
  • Memo: It is a value.

Return value:

It returns the value of the last iteration returned by the _.reduce() function.

Passing a list of numbers to _.reduce() function:

The ._reduce() function takes the elements from the list one by one and does the specified operations on the code. Like here the operation is the addition of the elements of the list. After adding all the elements, the reduce function ends. Here the starting value of the memo is taken as ‘0’. 

Example: The below code example implements the underscore.js _.reduce() method.

html




<!DOCTYPE html>
<html>
 
<head>
    <script src=
    </script>
    <script type="text/javascript" src=
    </script>
 
    <script type="text/javascript" src=
    </script>
</head>
 
<body>
    <script type="text/javascript">
        let sum = _.reduce(
        [1, 2, 3, 4, 5], function (memo, num)
        {
            return memo + num;
        });
        console.log(sum);
    </script>
</body>
 
</html>


Output:  

Output

Passing and not passing the value of memo:

If we are not passing memo variable’s value then it takes the value of the first element from the list. Otherwise it takes the mentioned value. 

Example: The below example implements the underscore.js _.reduce method with and without memo parameter.

html




<!DOCTYPE html>
<html>
 
<head>
    <script src=
    </script>
    <script type="text/javascript" src=
    </script>
 
    <script type="text/javascript" src=
    </script>
</head>
 
<body>
    <script type="text/javascript">
        let sum1 = _.reduce(
        [1, 2, 3, 4, 5], function (memo, num)
        {
            return memo + num;
            0
        });
        let sum2 = _.reduce(
        [1, 2, 3, 4, 5], function (memo, num)
        {
            return memo + num;
            5
        });
        console.log(sum1);
        console.log(sum2);
    </script>
</body>
 
</html>


Output:  

Output

Finding out the value of num variable:

The ‘num’ variable is a variable which stores the values of the list elements. Therefore since we are returning the value at the end when the function gets over, so, this implies that the list is also over. Therefore, the last element of the list will be printed. 

Example: The below code example finds out the value of num variable use underscore.js _.reduce() method.

html




<!DOCTYPE html>
<html>
 
<head>
    <script src=
    </script>
    <script type="text/javascript" src=
    </script>
    <script type="text/javascript" src=
    </script>
</head>
 
<body>
    <script type="text/javascript">
        let num = _.reduce(
        [1, 2, 3, 4, 5], function (memo, num)
        {
            return num;
        });
        console.log(num);
    </script>
</body>
 
</html>


Output:    

Output

Applying logical operators in the _.reduce() function:

From the above examples we are clear that in the value of memo is 1 and that of num is 5 (for this example only). So, we can apply the logical operator (>, <) to compare the values of num and memo and then print their values.

Example: The below code example uses logical operators with the underscore.js _.reduce() method.

html




<!DOCTYPE html>
<html>
 
<head>
    <script src=
    </script>
    <script type="text/javascript" src=
    </script>
 
    <script type="text/javascript" src=
    </script>
</head>
 
<body>
    <script type="text/javascript">
        let result = _.reduce(
        [1, 2, 3, 4, 5], function (memo, num)
        {
            if (memo < num)
                return memo;
            else
                return num;
        });
          console.log(result);
    </script>
</body>
 
</html>


Output:   

Output



Last Updated : 11 Jan, 2024
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads