closure !

Comprendre la closure : myForEach(fruits, couper(3));

 code

Problème

  const Pizzas = [

    { name:"queen", w: ["🐷","🍄","🍅","🧀"] },

    { name: "cheese", w: ["🧀", "🍅"]},

    { name: "oriental", w: ["🍅","🐑","🍄","🌶"]},

    { name: "royal", w: ["🍅","🌵"]},

  ],


  price = new Map([ ["🍅", 1], ["🐷", 2], ["🌶",2], ["🍄", 5], ["🧀", 5], ["🐑", 2], ["🌵", 10]]);


a) Donner l'ensemble des ingrédients


Donner pour chaque ingrédient le nombre de pizzas 


Ajouter le prix pour chaque pizza

[[object Object] {

  name: "queen",

  price: 13,

  w: ["🐷", "🍄", "🍅", "🧀"]

}, 

...

}]


    Trouver si une pizza a de la salade "🥗" 

Trouver si une pizza a du "🌵"

Donner le code pour savoir si une pizza est végétarienne ("🐷", "🐑")

Je suis végétarien, je filtre mes ingrédients !

 

Nous allons utiliser notre fonction de filtre pour retirer les ingrédient qui n'appartiennent pas à un ensemble regroupant ["🐷", "🐑","🐔"].
Nous reviendrons sur cet objet Ensemble qui est très facile d'utilisation.

Lectures

Lectures



N'oublions pas de nous amuser sur des exemples de la vie quotidienne ! 


PLUS JAMAIS de boucles

L'idée géniale est d'encapsuler les boucles dans une fonction.
La fonction appliquée à chaque itération est passée en paramètre.


forEach

  1. function forEach(t, fx) {
  2.     for (let i = 0; i < t.length; i++) {
  3.         fx(t[i])
  4.     }
  5. }

trans

  1. function trans(t, fx) {
  2.     const tmp = [];
  3.     for (let i = 0; i < t.length; i++) {
  4.         tmp[i] = fx(t[i])
  5.     }
  6.     return tmp;
  7. }

filter

  1. function filter(t, fx) {
  2.     const tmp = [];
  3.     for (let i = 0; i < t.length; i++) {
  4.         if (fx(t[i])) {
  5.             tmp.push(t[i]);
  6.         }
  7.     }
  8.     return tmp;
  9. }


En action : 

💥lien

les méthodes des tableaux

 

Some, every



rappel : destructuration

map

   

reduce

   

filter

  

Boucles

 

Discussion autour des boucles

Amélioration du code

La structuration de valeurs dans un tableau, nécessite une boucle pour réaliser un parcours des valeurs.

Exemple : 

Affichons simplement les éléments d'un tableau :

  1. let array = [1, 2, 3];
  2. for (let i = 0; i < array.length; i++) {
  3.   let current = array[i];
  4.   console.log(current); // affichage
  5. }

Imaginons l'affichage des valeurs comme une action.

  1. for (let i = 0; i < array.length; i++) {
  2.   let current = array[i];
  3.   actionAffichage(current); // affichage
  4. }

Affichage des positifs

Pour afficher les valeurs positives, il est facile de créer une condition ; la fonction précédente devient.

  1. for (let i = 0; i < array.length; i++) {
  2.   let current = array[i];
  3.   if (current>0) actionAffichage(current);
  4. }

ou

  1. for (let i = 0; i < array.length; i++) {
  2.   let current = array[i];
  3.   actionAffichagePositif(current);
  4. }


Affichage des Négatifs

Pour afficher les valeurs négatives, il est facile de créer une condition ; la fonction précédente devient.

  1. for (let i = 0; i < array.length; i++) {
  2.   let current = array[i];
  3.   actionAffichageNégatif(current);
  4. }


Bilans

Pour chaque type d'affichage, il est nécessaire de redéfinir la boucle.

Améliorations

Nous allons encapsuler le code de la boucle dans une fonction forEach. 👿

Il nous reste à réfléchir sur le passage des actions (positif, négatif ...) 

comme paramètres.


Ainsi,  "afficher quelque chose" peut être vu comme une fonction.
Les fonctions étant des variables et comme les variables peuvent être passées en paramètres, on peut passer "afficher quelque chose" à une fonction.

Ainsi, la fonction "afficher quelque chose" sera passée en paramètre à la fonction forEach.

Résumé des codes


Affichage

function affVal(v){
   console.log(`val tab : ${v}`)
}


Affichage Positif

function AffPositif(v){
   if (v>0) console.log(` val positif : ${v} `);
}


Boucle sur le tableau

function forEach(array, fx) {
  for (var i = 0; i < array.length; i++)//for of
    fx(array[i]);
}


Appel


forEach(T, AffPositif);

Appel anonyme

forEach(T, function (v){
  console.log(`-> tab : ${v}`);
});


En Action