Différences entre versions de « Technologies avancées du eLearning 2/exercices/Équipe »
De GBLL, TAL, ALAO, etc.
< Cours:Technologies avancées du eLearning 2
| Ligne 45 : | Ligne 45 : | ||
</body> | </body> | ||
</html> | </html> | ||
| + | </syntaxhighlight> | ||
| + | == Correction == | ||
| + | On en est là : | ||
| + | <syntaxhighlight lang="JavaScript">class Equipe{ | ||
| + | constructor(nomEq, logo){ | ||
| + | this.nom = nomEq; | ||
| + | this.logo = logo; | ||
| + | this.listeMembres = [] | ||
| + | } | ||
| + | |||
| + | nomEq(){ | ||
| + | return this.nom; | ||
| + | } | ||
| + | |||
| + | nbMembres(){ | ||
| + | return this.listeMembres.length; | ||
| + | } | ||
| + | |||
| + | ajoutMembre(nom){ | ||
| + | //TODO : Permet d'ajouter un membre à la liste des membres | ||
| + | } | ||
| + | |||
| + | toHTML(){ | ||
| + | //TODO : Crée une chaine de caractères au format HTML pour afficher l'équipe | ||
| + | } | ||
| + | } | ||
| + | |||
</syntaxhighlight> | </syntaxhighlight> | ||
Version du 15 janvier 2019 à 21:16
Test de votre classe
Créer un document HTML avec le contenu suivant, en veillant à adapter :
- la ligne n°5 en fonction du nom de votre fichier javascript ;
- la ligne n°6 en fonction de votre fichier de logo.
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<script type="text/javascript" src="equipe.js"></script>
<link type="text/css" rel="stylesheet" href="style.css" />
<script type="text/javascript">
function init(){
var monEquipe = new Equipe("DILIPEM", "logo.svg") ;
//Test de la méthode nomEq()
if(monEquipe.nomEq() == "DILIPEM"){
console.log("Bravo nomEq() marche.");
}
else{
console.error("Attention à la méthode nomEq() (ou au constructeur)");
}
//test de la méthode nbMembres()
if(monEquipe.nbMembres() === 0){
console.log("Bravo, il y a des chances que nbMembres() fonctionne");
}
else{
console.error("Attention à nbMembres (ou au constructeur)");
}
//test de l'ajout de membres
monEquipe.ajoutMembre("Jean-Pierre") ;
monEquipe.ajoutMembre("Jacqueline") ;
if(monEquipe.nbMembres() === 2){
console.log("Bravo, il y a des chances que nbMembres() et ajoutMembre() fonctionnent.");
}
else{
console.error("Attention à nbMembres (ou à nbMembres)");
}
var elt = document.getElementsByTagName('body')[0];
console.log(elt);
elt.innerHTML = monEquipe.toHTML();
}
window.onload=init;
</script>
</head>
<body>
</body>
</html>
Correction
On en est là :
class Equipe{
constructor(nomEq, logo){
this.nom = nomEq;
this.logo = logo;
this.listeMembres = []
}
nomEq(){
return this.nom;
}
nbMembres(){
return this.listeMembres.length;
}
ajoutMembre(nom){
//TODO : Permet d'ajouter un membre à la liste des membres
}
toHTML(){
//TODO : Crée une chaine de caractères au format HTML pour afficher l'équipe
}
}