function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Robin BarnwellRobin Barnwell 

Lightning Components Basics - Input Data Using Forms - Reduce Function

Midway through this module the following Client Controller code is introduced.  Is the Reduce function documented anywhere else so I can understand it better.  The Trailhead explanation doesn't work for me, very stuck

({
    clickCreate: function(component, event, helper) {
        var validExpense = component.find('expenseform').reduce(function (validSoFar, inputCmp) {
            // Displays error messages for invalid fields
            inputCmp.showHelpMessageIfInvalid();
            return validSoFar && inputCmp.get('v.validity').valid;
        }, true);
        // If we pass error checking, do some real work
        if(validExpense){
            // Create the new expense
            var newExpense = component.get("v.newExpense");
            console.log("Create expense: " + JSON.stringify(newExpense));
            helper.createExpense(component, newExpense);
        }
    }
})


 
Best Answer chosen by Robin Barnwell
sfdcMonkey.comsfdcMonkey.com
hi robin, reduce() is javaScript array method, here validSoFar and inputCmp are method argument / parameters. actaully this is the syntax of this method :

syntax : array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

for better understanding please refer below link :
https://www.w3schools.com/jsref/jsref_reduce.asp  

Let us know if it helps you, and kindly mark it best answer it this answer helps you so it make proper solution for others in future 
thanks
 

All Answers

Aman MalikAman Malik
Hi,
The reduce() method applies a function against an accumulator and each element in the array (from left to right) to reduce it to a single value.
Read here for more details:
var total = [0, 1, 2, 3].reduce(function(sum, value) {
    return sum + value;
}, 0); // total is 6
reduce function is part of array prototype javascript object. It takes a function as input and applies that on the array and returns the output.
In this case the function does a summation of array members and returns the output.This is achieved by using reduce function which applies it on each and every member.

Hope this helps.

Please like the answer and mark it as best if it helps.

Thanks,
Aman
Robin BarnwellRobin Barnwell
Thanks Aman, I saw that explanation on Stackexchange already: https://salesforce.stackexchange.com/questions/184525/help-me-to-undestand-this-lightning-helper-methods-reduce-showhelpmessageifin/184535

I was looking for the officail Salesforce documentation.

Specific issue is validSoFar and inputCmp variables are used but never defined anywhere.  In your example where are the input variables defined sum, value?  That is the bit I don't get, what loads these variables with information for Reduce to do it's thing?
sfdcMonkey.comsfdcMonkey.com
hi robin, reduce() is javaScript array method, here validSoFar and inputCmp are method argument / parameters. actaully this is the syntax of this method :

syntax : array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

for better understanding please refer below link :
https://www.w3schools.com/jsref/jsref_reduce.asp  

Let us know if it helps you, and kindly mark it best answer it this answer helps you so it make proper solution for others in future 
thanks
 
This was selected as the best answer
Robin BarnwellRobin Barnwell
Thanks.  I think for now I going to have to accept that this is just "magic" and works.  Will return to this when I get much deeper into learning Javascript.  The problem appears to be that I don't know Javascript yet and that it is such a loosely typed language.
Rich FiekowskyRich Fiekowsky
The reduce() function is part of Javascript. In brief, it processes a set of values by iterating over them and calling a function for each, and accumulating a result.
It is a method that can be called by any JS object (aka variable) (aka value), but only is useful and sensible to use when the JS object, the caller, contains more than one value. In the Trailhead exercise, it is called by a list of lightning:inputField components, which is what component.find(...) returned.
reduce() takes an anonymous function - i will call it "myFunc()" - as the first argument. reduce() takes an initial value - "myInit" - as a second argument.
myFunc() takes two arguments, which i will call myValid and oneValue. reduce() proceeds in this way:
  1. It sets myValid to myInit (in the Trailhead exercise, this is the final "true"). 
  2. Then, for each of the values in the caller, it sets oneValue to that value, and calls myFunc(myValid, oneValue).
  3. Then it returns whatever the final call to myFunc() returned.
It only is sensible to do this if myFunc() modifies myValid, so that results can acumulate during the iteration. myFunc could add up a list, and return the sum (as above). Or, as in the Trailhead exercise, it can check whether all the field-input-values in the list are all valid, and return that Boolean value. HTH! 
Robin BarnwellRobin Barnwell
Thanks Rich, I've figured it out now, moved on to the Lighning Component Superbadge.  The problem is there are a whole load of undocumented capabilities, like this, which you only discover if you know Javascript.  Some work and some are disabled.  So when you discover a Javascript feature you don;t know if it will work or not.

Lightning Components seem to go against the No Code approach and make Salesforce a very tough environment to build solutions quickly now
Rich FiekowskyRich Fiekowsky
JS is very well documented on the internet,  including a good starting point at https://developer.mozilla.org/en-US/docs/Web/JavaScript , and great tutorials at https://www.w3schools.com/jS/default.asp . Sorry I ignored your actual question, which was, "is [it] documented anywhere...."? www.Oracle.com and javascript.com can get you to JS doc too. My personal favorite is to search the feature on Google, such as searching "reduce javascript tutorial", which usually gets me straight into a W3C tutorial. Just avoid the "official" documentation , the EcmaScript RFCs, which are too formal and detailed for most purposes. I agree that Lightning is not a "no-code" environment. It adds portability, integration, and better response time, but loses simplicity, even compared to Apex solutions.
Rich FiekowskyRich Fiekowsky
oops i meant w3schools.com not w3c .