ce qui est l'équivalent d'une réduction en javascript

voix
0

Je suis un back-end dev a récemment déménagé sur côté js. Je traversais un tutoriel et suis tombé sur le morceau de code ci-dessous.

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);
    }
}

Ici , j'ai essayé de comprendre beaucoup de choses sur ce qui se passe, il y a quelque chose appelé reduceet une autre chose nommée validSoFar. Je suis incapable de comprendre ce qui se passe sous le capot. :-(

Je reçois les boucles régulières des choses que fait dans Java.

Quelqu'un peut-il s'il vous plaît doucher un peu de lumière sur ce qui se passe ici. Je devrais utiliser ce beaucoup dans mon travail régulier.

Merci

Créé 19/09/2018 à 13:24
source utilisateur
Dans d'autres langues...                            


3 réponses

voix
0

Ceci est un équivalent raisonnable:

var validExpense = true;
var inputCmps = component.find('expenseform')
for (var i = 0; i < inputCmps.length; i++) {
    // Displays error messages for invalid fields
    inputCmp.showHelpMessageIfInvalid();
    if (!inputCmp.get('v.validity').valid) {
        validExpense = false;
    }
}
// Now we can use validExpense

Ceci est une utilisation quelque peu étrange reduce, pour être honnête, parce qu'il fait plus que la simple réduction de la liste à une valeur unique. Elle produit aussi des effets secondaires (probablement) dans l'appel à showHelpMessageIfInvalid().

L'idée de reduceest simple. Étant donné une liste de valeurs que vous souhaitez rabattre un à la fois en une seule valeur (de la même ou tout autre type), vous fournissez une fonction qui prend la valeur repliée actuelle et la valeur suivante de la liste et retourne une nouvelle valeur repliée , et que vous fournissez une valeur initiale repliée, et reduceles combine en appelant la fonction à chaque valeur de la liste successive et la valeur actuelle repliée.

Ainsi, par exemple,

var items = [
  {name: 'foo', price: 7,  quantity: 3},
  {name: 'bar', price: 5,  quantity: 5},
  {name: 'baz', price: 19, quantity: 1}
]

const totalPrice = items.reduce(
  (total, item) => total + item.price * item.quantity, // folding function
  0  // initial value
); //=> 65
Créé 19/09/2018 à 13:45
source utilisateur

voix
0

Il n'a pas de sens d'utiliser à réduire là et avoir des effets secondaires de la réduire. Mieux utiliser Array.prototype.filter pour obtenir tous les postes de dépenses non valides.

Utilisez ensuite Array.prototype.forEach pour produire des effets secondaires (s) pour chaque élément non valide. Vous pouvez ensuite vérifier la longueur du tableau des postes de dépenses non valides pour voir votre entrée était valide:

function(component, event, helper) {
  var invalidExpenses = component.find('expenseform').filter(
    function(ex){
      //return not valid (!valid)
      return !ex.get('v.validity').valid
    }
  );
  invalidExpenses.forEach(
    //use forEach if you need a side effect for each thing
    function(ex){
      ex.showHelpMessageIfInvalid();
    }
  );
  // If we pass error checking, do some real work
  if(invalidExpenses.length===0){//no invalid expense items
      // Create the new expense
      var newExpense = component.get("v.newExpense");
      console.log("Create expense: " + JSON.stringify(newExpense));
      helper.createExpense(component, newExpense);
  }
}

La documentation mdn pour Array.prototype.reduce a une bonne description et des exemples sur la façon de l' utiliser.

Il devrait prendre une série de choses et de revenir une autre chose (peut être différent genre de chose). Mais vous ne trouverez pas des exemples là où les effets secondaires sont initiés dans la fonction réducteur.

Créé 19/09/2018 à 13:42
source utilisateur

voix
0

La fonction ici est de réduire itération dans chaque composante d'entrée de la forme de la charge et la cartographie par incréments d'une valeur booléenne. Si vous avez par exemple trois entrées chacun avec une vraie validité, la diminution de la fonction renverrait:

  1. true && true où la première vraie est la valeur initiale passé en réduire.
  2. true && true et où le premier vrai est ici le résultat du résultat précédent.
  3. true && true

A la fin de la réduction, vous vous retrouvez avec un booléen unique représentant la validité de l'ensemble, où que si par une seule validité du composant d'entrée est fausse, la réduction entière s'élèvera à faux. En effet , validSoFarassure le suivi de la validité globale et est muté en retournant le composé de savoir si la forme est valable jusqu'à présent et la validité de l'entrée en cours dans l' itération.

Créé 19/09/2018 à 13:38
source utilisateur

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more