Afficher une base de données

 Préparation à l'examen ! 


cliquez sur la figure

https://docs.google.com/document/d/1PlQV0kN9rHzO894GzqNlterJT_rYWEX9rehrBwDtQ7c/edit?usp=sharing



Base de Données !

 Nous disposons de deux structures : un tableau de films et d'un Map.

Tableau de films :

Il s'agit d'un tableau d'objets où chaque objet représente un film.

Chaque objet film contient les propriétés suivantes :

  • titre : Le titre du film (chaîne de caractères).

  • année : L'année de sortie du film (nombre).

  • director : Le réalisateur du film (chaîne de caractères).

  • actors : Tableau des acteurs ayant joué dans le film (tableau de chaînes).

Exemple

  1. {

  2.     title: "Inception",

  3.     year: 2010,

  4.     director: "Christopher Nolan",

  5.     actors: ["Leonardo DiCaprio", "Elliot Page", "Tom Hardy"]

  6. }

  1. const films = [

  2.     {

  3.         title: "Inception",

  4.         year: 2010,

  5.         director: "Christopher Nolan",

  6.         actors: ["Leonardo DiCaprio", "Elliot Page", "Tom Hardy"]

  7.     },

  8.     {

  9.         title: "The Dark Knight",

  10.         year: 2008,

  11.         director: "Christopher Nolan",

  12.         actors: ["Christian Bale", "Heath Ledger", "Michael Caine"]

  13.     },

  14.     {

  15.         title: "Titanic",

  16.         year: 1997,

  17.         director: "James Cameron",

  18.         actors: ["Leonardo DiCaprio", "Kate Winslet", "Billy Zane", "Kathy Bates"]

  19.     },

  20.     {

  21.         title: "Avatar",

  22.         year: 2009,

  23.         director: "James Cameron",

  24.         actors: ["Sam Worthington", "Zoe Saldana", "Sigourney Weaver"]

  25.     },

  26.     {

  27.         title: "Mad Max: Fury Road",

  28.         year: 2015,

  29.         director: "George Miller",

  30.         actors: ["Tom Hardy", "Charlize Theron"]

  31.     }

  32. ];

  33. console.log(films);


actorSalaries Map :

Il s'agit d'un objet Map où chaque entrée représente un acteur et son salaire.

La clé est le nom de l'acteur (chaîne de caractères).

La valeur est le salaire de l'acteur en milliers de dollars (nombre).

Exemple :

["Leonardo DiCaprio", 200000]


  1. const actorSalaries = new Map([

  2.     ["Leonardo DiCaprio", 200000],

  3.     ["Elliot Page", 1000],

  4.     ["Tom Hardy", 15000],

  5.     ["Christian Bale", 10000],

  6.     ["Heath Ledger", 5000],

  7.     ["Michael Caine", 2000],

  8.     ["Kate Winslet", 8000],

  9.     ["Billy Zane", 1000],

  10.     ["Kathy Bates", 3000],

  11.     ["Sam Worthington", 5000],

  12.     ["Zoe Saldana", 6000],

  13.     ["Sigourney Weaver", 7000],

  14.     ["Charlize Theron", 10000]

  15. ]);


  16. console.log(actorSalaries);



DM

 

 Etudiez le code 

🆘Help


En action



DS

Projets

  1. Ecrire un simulateur de calcul des taux ! 

  2. Ecrire un simulateur pour afficher les échéances


Code en action


🪛Proposez des améliorations ! (pas de graphisme et MVC).

Délégation : 🆘

Etude de code !

See the Pen delegation Map by dupont (@dupontcodepen) on CodePen.



Etudiez le code

ANNONCE DS : Lundi 07 novembre

 Un DS machine, comme en entreprise aura lieu Lundi 07 novembre.

D+

have fun with JS

Vici du code JS à étudier :  

https://github.com/dupontdenis/operateursL2.git


Ce code utilise de façon élégante la destructuration associée à l'opérateur ternaire.

Asynchronisme !

 


👿C'est quoi le problème ?

⏱️Etude de l'asynchronisme


Introduction : les modules de Node ( https://dupontnodejs.blogspot.com/p/modules.html )

Commencez avec npm  : Start with npm

Les dernières nouveautés du Langage.

🥷CJM versus ESM

🥇High level await 

Les modules

Slides


Cours

TD


Projet



Vidéo


projet

 

🪛 Projet

 L'objectif 

Adaptez le Projet mis en place par ©️ Mozilla.


Environnement

Nous découvrirons Express and Co

 

🔧Les chapitres de cours

https://dupontes6.blogspot.com/

https://dupontnodejs.blogspot.com/

https://dupontmongodb.blogspot.com/

https://dupontexpressjs.blogspot.com/


IA : Github copilot

IA dans votre editeur: Copilot


🆘Aide à l'écriture de code 

Tapez 
function findLowerValue(tab, callback) {

🚀Copilot comprend et vous propose le code !



🥇Mieux encore, copilot  propose des tests ! 

🥇Code généré par copilot ! 
const tab = [4, 6, 1, 3, 2, 5];
const lowerValue = findLowerValue(tab, (value) => value);
console.log(lowerValue); // 1

const lowerValue2 = findLowerValue(tab, (value) => -value);
console.log(lowerValue2); // 6

Voici un code généré étape par étape par copilot ! 
C'est le pilot qui doit guider le copilot.

function calculator(str){
  // regexp to match the numbers and operators
  const regexp = /(\d+)(\+|\-|\*|\/)(\d+)/;
  //use match method to get the numbers and operators
  const match = str.match(regexp);
  //use parseInt to convert the string to number
  const num1 = parseInt(match[1]);
  const num2 = parseInt(match[3]);

  //use switch to do the calculation
  switch(match[2]){
    case '+':
      return num1 + num2;
    case '-':
      return num1 - num2;
    case '*':
      return num1 * num2;
    case '/':
      if(num2 === 0){
        return 'Cannot divide by 0';
      }
      return num1 / num2;
  }
}

// given test cases
console.log(calculator('1+1')); // 2

🥇Pythontutor



🆒Try yourself

Play with arrays