On veut maintenant faire évoluer notre version précédente et créer une classe d’objets ToDo à la place d’un seul objet todo.
Ceci va nous permettre de créer autant d’objet todo que l’on souhaite, et donc apporter la possibilité de créer plusieurs listes.
- Dupliquer le fichier v3-object.js et le nommer v4-object-class.js
- Mettre à jour le commentaire en haut du fichier
- Créer une classe ToDo ( avec le mot-clé class et des accolades { } )
- À l’intérieur de la classe, créer une méthode constructor :
- qui prend en paramètres une String name et un tableau items
- qui initialise les propriétés name et items de l’objet (avec this.name et this.items) aux valeurs passées en paramètres
- Créer un nouvel objet de votre classe (avec le mot-clé new) puis afficher le avec un console.log
- Votre code devrait ressembler à cela :
class ToDo {
constructor(name = 'My todo list', items = []) {
this.name = name;
this.items = items;
}
}
let todo1 = new ToDo;
console.log(todo1);
- Méthode display
- Une différence de syntaxe notable entre les objets et les classes d’objet est la séparation des méthodes
- Dans les objets, les méthodes sont séparées par des virgules ,
- Dans les classes, il ne faut pas de virgule, uniquement un saut de ligne
- Exemple pour la méthode display :
class ToDo {
constructor(name = 'My todo list', items = []) {
this.name = name;
this.items = items;
}
display() {
console.log(this.name, this.items);
console.log('Items number: ', this.items.length, '\n');
}
}
- Replacer la méthode add dans la classe
- Replacer la méthode change dans la classe
- Replacer la méthode remove dans la classe
- Créer maintenant au moins 2 objets de la classe ToDo et tester les différentes méthodes
Essayez de tout faire par vous même, puis vous pouvez comparer avec cette correction.