Pages

DM du WE !

const array=["dupont", "dupond", "dupont", "dupond", "dupont", "dupond", "dupont"];

 const separe = function(array){
   
   let i = 0
      ,j = array.length-1;
    while (i < j) {
        if (array[i] == "dupond"){
            i++
        }
        else{
          let tmp = array[i];
          array[i] = array[j];
          array[j] = tmp;
          j--
        }
    }
    return array
 }

console.table(separe(array))

🥷Que vaut array ?



Rendre la monnaie

 

Article ( voir lien )

Recursif !

 Vous connaissez la fonction Factorielle ! Voic trois écritures de cette fonction.

function factorielle(n) {
  return n == 0 ? 1 :  n * factorielle (n-1);
}

// arrow function
const factorielle = (n) => (n > 0 ? n * factorielle(n - 1) : 1);

// arrow function
const factielle = n => n === 0 ? 1 : n * factorielle(n - 1);





>factorielle(6)
720

Il est important de comprendre les appels récursifs. Voici des exemples d'exécution :
récursif  code




👿 le premier appel finit en dernier

Voici deux autres exemples d'utilisation du principe de récursion :

La fonction puissance

Décomposition

🥷 const fact = n => n === 0 ? 1 : n * fact(n - 1);

Corrrection partie A

Mes solutions et dialogue avec Copilot !


A) Sélectionnez les deux premiers <p> avec quatre types de sélecteurs différents.

<p id="d1" class="s">p 1</p>

<p id="d2" class="s">p 2</p>

<p id="d3">p 3</p>

<p id="d4">p 4</p>








Quelques idées pour la selection (🚀tripadvisor)
  1. #item1, #item2 🚀🚀
  2. p:nth-child(-n+2)
  3. [class^="s"]
  4. [class$="s"]
  5. p:not(#d3,#d4)
  6. p:not(p+p+p) 
  7. p:not(p~p+p) 
  8. [class="s"]
  9. [id="d2"],[id="d1"]
  10. p:first-child,  p:first-child+p 🚀
  11. p:nth-child(1), p:nth-child(2) 🚀
  12. p:nth-last-child(n+3)
  13. p:nth-child(-n+2)
  14. p:not(#d3,p:last-child)
  15. p:nth-of-type(-n+2)
  16. p:not(p:nth-child(n+3))
  17. p[class]
  18. p:not(p:nth-last-child(-n+2))
  19. .s 🚀🚀
et une de vos solutions p:not( p:nth-last-child(3)~p)

Dialogue avec Copilot :


Il a eu un long dialogue pour lui demander de ne pas utiliser ce type de selecteurs : 

  1. :root p:nth-child(1), ::root p:nth-child(2) - Selects the first and second child of the parent within the root
  2. body > p:nth-child(1), body > p:nth-child(2) - Selects the first and second child of the parent within the body
  3. html > body > p:nth-child(1), html > body > p:nth-child(2) - Selects the first and second child of the parent within the body within the html
J'ai beaucoup aimé la remarque de Copilot concernant la structure de HTML. 


Please note that some of these selectors might not work as expected if there are other elements in the body before the paragraphs.

 
Voici une réponse Copilot : 

p:first-child, p:first-child + p,
p:nth-child(1), p:nth-child(2),
p:nth-of-type(1), p:nth-of-type(2),
#d1, #d2,
.s:first-child, .s:first-child + .s,
.s:nth-child(1), .s:nth-child(2),
.s:nth-of-type(1), .s:nth-of-type(2),
p[id='d1'], p[id='d2'],
p.s:first-child, p.s:first-child + p.s,
p.s:nth-child(1), p.s:nth-child(2),
p.s:nth-of-type(1), p.s:nth-of-type(2),
p[id^='d']:first-child, p[id^='d']:first-child + p,
p[id^='d']:nth-child(1), p[id^='d']:nth-child(2),
p[id^='d']:nth-of-type(1), p[id^='d']:nth-of-type(2),
p.s[id^='d']:first-child, p.s[id^='d']:first-child + p,
p.s[id^='d']:nth-child(1), p.s[id^='d']:nth-child(2),
p.s[id^='d']:nth-of-type(1), p.s[id^='d']:nth-of-type(2),
p[id*='d']:first-child, p[id*='d']:first-child + p,
p[id*='d']:nth-child(1), p[id*='d']:nth-child(2),
p[id*='d']:nth-of-type(1), p[id*='d']:nth-of-type(2) {
    border: 1px solid;
}

Voici quelques remarques : 
🥷Why not use the :not selector, it's an oversight on your part.

GitHub Copilot
I apologize for the oversight. You're right, the :not selector can be used to exclude certain elements.

 Here are four CSS selectors using the :not pseudo-class to select the first two paragraphs:
  1. p:not(:nth-of-type(n+3)) - Selects the first two paragraphs, and not any paragraph from the third onwards.
  2. p:not(:nth-child(n+3)) - Selects the first two paragraphs, and not any child from the third onwards.

Vous pourriez également demander à copilot d'utilier last-child ! 

Array

Cours : 🗄️ Les tableaux ! 

Objectifs du cours

Quels codes donnent les nombre pairs, impairs, positifs, multiples de 2 ....

 

Trouvez le code pour

Objectifs du cours

🥷Passez au niveau Sup






Les tableaux

 

Les fonctions avec des tableaux


Rappels sur les Tableaux.


🥷Simulez les méthodes


🪛Exemples de code

const pers = [
  {
    nom: "Dupont",
    ville: "Evry",
    sex: "f",
  },
  {
    nom: "Brusel",
    ville: "Belfort",
    sex: "h",
  },

  {
    nom: "Dupont",
    ville: "PARIS",
    sex: "f",
  },
  {
    nom: "Durant",
    ville: "Paris",
    sex: "h",
  },
];

// have fun with for of
function affiche(tab, callback) {
  for (let [i, ele] of Object.entries(tab)) {
    console.log(callback ? callback(ele, i) : `${i}->${ele.nom}`);
  }
}

affiche(pers);
affiche(pers, ({ nom: name, ville: town }) => `${name} lives in ${town}`);

function afficheVille({ ville }, i) {
  return `${i} : ${ville}`;
}

affiche(pers, afficheVille);

// transforme
function transf(array, fx) {
  let passed = [];

  for (let v of array) passed.push(fx(v));

  return passed;
}

//
function civilite({ nom, sex }) {
  return sex == "h" ? `Monsieur ${nom}` : `Madame ${nom}`;
}

const newT = transf(pers, civilite);
console.log(newT);

//
function normalise(pers) {
  return (pers.ville = pers.ville.toUpperCase());
}
transf(pers, normalise);
console.table(pers);