Pages

Entrainement

- Donnez le corps de la fonction myFilter(array, test) qui renvoie un nouveau tableau contenant uniquement les éléments qui passent le test.

- Donnez la fonction de test fx pour obtenir le résultat suivant :  u = myFilter(T,fx)

Vous disposez de toutes les fonctions myForEach, mySome, myEvery, myIncludes, myMap … les boucles sont donc à bannir ! 

 <section>

    <div data-population="30" data-zone="zone1">Evry</div>

    <div data-population="20" data-zone="zone1">Corbeil-Essonnes</div>

    <div data-population="20" data-zone="zone2">Juvisy-sur-Orge</div>

    <div data-population="22" data-zone="zone1">Ris-Orangis</div>

    <div data-population="20" data-zone="zone3">Athis-Mons</div>

    <div data-population="20" data-zone="zone2">Massy</div>

  </section>

  <div id="population"></div>

-Récupérer tous les <div> contenus dans la balise <section> ?

 

-Récupérer la population d’une ville à partir d’un élément <div> ?

 

-Calculez la population totale et l’afficher dans #population ?


-Ajoutez une classe "highlight" aux villes ayant une population > 20


- Sélectionnez les villes de la zone 1 en utilisant myFilter()


- Sélectionnez les villes de la zone 1 sans utiliser myFilter()


- Trouvez toutes les zones en utilisant myMap puis myForEach et myIncludes.


- Evaluez le programme

  1. const t = [];


  2. myForEach(

  3.   myMap(villes, v => Number(v.dataset.population)),

  4.   p => {

  5.     if (!myIncludes(t, p)) {

  6.       t.push(p);

  7.     }

  8.   }

  9. );


- - Evaluez ce code

div.show::after {

  content: " — " attr(data-population)".000" ;

  font-weight: bold;

  color: #555;

} // CSS


const showPopulation = function (event) {

  event.target.classList.toggle("show");

};


const parent = document.querySelector("section");

parent.addEventListener("click", showPopulation, false);

// JS

- proposez une amélioration !