Tableaux et Objets

Licence Informatique 1ère année

Jean-Marc Lecarpentier

Enseignement des technologies du Web

 

Travail personnel

Objectifs

Pour continuer votre familiarisation avec JavaScript, ce TP vous fait travailler sur les structures de données qui vont servir ensuite pour chaque TP. Très important donc !

Notes de cours

Exercice 1 — Tableaux et objets, la suite #

Cet exercice fait partie de ceux qui seront évalués. La page doit être accessible et fonctionnelle à l'URL suivante :

https://dev-NUMETU.users.info.unicaen.fr/2020/TW2/TP02/ex1/tableaux.html
(en remplaçant NUMETU par le numéro correspondant). Pensez à vérifier la validité W3C de votre page !

D'autre part, l'élément head doit contenir le code suivant :

<meta name="author" content="NUMETU" />
en remplaçant NUMETU par votre numéro étudiant. (Il faut laisser name="author" tel quel, par contre !) Par exemple, si votre numéro est 21012343, vous mettez <meta name="author" content="21012343" /> dans le head de votre page. Pour cet exercice, il est interdit de travailler en binôme.

Il est conseillé de vérifier que l'exercice a été correctement rendu en utilisant l'application evalweb.

Vous avez jusqu'au début du TP de la semaine suivante pour terminer l'exercice.

Cet exercice a pour objectif d'approfondir la manipulation de divers types en Javascript.

Télécharger cette archive contenant un fichier HTML et un fichier Javascript pour le TP.

IMPORTANT : ne PAS changer les variables définies dans le fichier Javascript. Pour tester vos fonctions, utiliser ces variables et faire un console.log du résultat de chaque fonction. Pour chaque question, le résultat attendu est alors indiqué, ce qui vous permet de vérifier si votre résultat est correct.

Faire les affichages uniquement avec des console.log

Tableaux

Pour certaines questions, il pourra être utile de consulter documentation Javascript sur les tableaux.

Pour chaque cas, tester avec les variables indiqués (les variables sont déjà dans le fichier Javascript fourni) et afficher en console les résultats des fonctions.
Écrire les fonctions qui :

  1. Prend en argument un tableau tab et retourne la somme des éléments de celui-ci.
    Tester avec tableau1
    Résultat attendu : 83
  2. Prend en argument un tableau tab et retourne le dernier élément de celui-ci.
    Tester avec tableau1
    Résultat attendu : 9
  3. Prend en argument un tableau tab et un entier n et retourne la liste des n derniers éléments de celui-ci. Si n est plus grand que la taille du tableau on retourne le tableau complet. On pourra éventuellement utiliser slice().
    Tester avec tableau1 et n = 3 puis n = 12
    Résultat attendu : Array(3) [ 5, 7, 9 ] puis Array(8) [ 2, 5, 9, 45, 1, 5, 7, 9 ]
  4. Prend en argument un tableau d'entiers tab et un entier n, et retourne un tableau contenant uniquement les éléments de tab supérieurs à n
    Tester avec tableau1 et n = 5
    Résultat attendu : Array(4) [ 9, 45, 7, 9 ]
  5. Prend en argument 2 tableaux d'entiers et retourne le tableau des éléments communs. Utiliser indexOf() pour tester la présence d'un élément dans un tableau. Attention à ne pas ajouter plusieurs fois le même entier s'il apparait plusieurs fois dans un des deux tableaux.
    Tester avec tableau1 et tableau2
    Résultat attendu : Array(3) [ 2, 9, 45 ]
  6. Prend en argument 2 tableaux d'entiers et retourne le tableau des éléments n'apparaissant que dans un seul des deux tableaux
    Tester avec tableau1 et tableau2
    Résultat attendu : Array(9) [ 5, 1, 7, 12, 4, 78, 0, 10, 29 ]
  7. Optionnel (à faire si vous avez tout fait avant la fin du TP).
    Prend en argument un tableau d'entiers en entrée et retourne la chaîne de caractères composée des lettres minuscules correspondant à chaque entier modulo 26. On pourra utiliser fromCodePoint() et la table des caractères ASCII
    Tester avec tableau1 puis tableau2
    Résultat attendu : cfjtbfhj puis jmeaatckd

Objets

  1. Créer un objet avec 2 propriétés et l'afficher en console :
    • title ayant la valeur "le titre"
    • liste étant une liste (tableau) d'entiers 5, 8, 19
  2. Créer un objet avec 2 propriétés et l'afficher en console :
    • contact ayant pour valeur un objet avec 2 propriétés :
      • email ayant pour valeur "toto@gmail.com"
      • phone ayant pour valeur "098765432"
    • stores ayant pour valeur une liste d'objets :
      1. un objet avec les propriétés name valant "BestStore" et city valant "Houston"
      2. un objet avec les propriétés name valant "TestZone" et city valant "Paris"
      3. un objet avec les propriétés name valant "ZeStore" et city valant "London"

Objets, suite

On modélise les points du plan par un objet Javascript comme sur cet exemple :
let A = { "x": 5, "y": -2 };

  1. Écrire une fonction prenant en argument 2 entiers et retourne un objet point selon le modèle ci-dessus.
    Créer les points A(2,-6), B(2, 3) et C(-7, 3) et les afficher en console.
  2. Écrire une fonction qui prend en argument 2 points X et Y et calcule la distance XY.
    Voir les fonctions Math de Javascript pour le calcul.
    Tester avec les points A et B créés auparavant et afficher en console la distance AB.
    Résultat attendu : 9
  3. Écrire une fonction qui prend en argument 3 objets points X, Y et z et retourne le boolén vrai si (XY) et (YZ) sont orthogonales.
    Tester avec les points A, B et C puis avec A, C et B
    Résultat attendu : true puis false

Objets encore

On considère l'objet suivant qui modélise un ensemble de personnes :

let liste = {
    "Cole": {
        "nom": "Cole",
        "prenom": "Hickman",
        "email": "marquitatillman@sarasonic.com",
        "telephone": "06.31.17.18.12"
    },
    "Triat": {
        "nom": "Triat",
        "prenom": "Welch",
        "telephone": "06.96.93.50.31"
    },
    "Cabrera": {
        "nom": "Cabrera",
        "prenom": "Gary",
        "email": "hopkinslarson@netur.com"
    },
    "Humphrey": {
        "nom": "Humphrey",
        "prenom": "Jody"
    }
};

Réaliser en console :

  1. Afficher la liste des clés de l'objet liste
  2. Afficher si la clé Toto apparait dans l'objet liste
  3. Afficher si la clé Humphrey apparait dans l'objet liste
  4. Afficher les coordonnées de chaque personne sous la forme ci-dessous. Bien entendu il faut que le code marche encore et affiche les bonnes informations si on change les données de la liste de personnes. Tester par exemple en ajoutant un email ou téléphone à quelqu'un qui n'en a pas, puis en ajoutant 2 personnes en plus.
    On pourra chercher les fonctions utilise dans la documentation sur les objets et voir comment itérer sur les clés d'un objet (Attention : ce n'est pas le for...in de Python !!)
    Hickman Cole a pour téléphone 06.31.17.18.12
    Hickman Cole a pour adresse email marquitatillman@sarasonic.com
    Welch Triat a pour téléphone 06.96.93.50.31
    Welch Triat n'a pas d'adresse email.
    Gary Cabrera n'a pas de téléphone.
    Gary Cabrera a pour adresse email hopkinslarson@netur.com
    Jody Humphrey n'a pas de téléphone.
    Jody Humphrey n'a pas d'adresse email.