Pour cette partie de l’exercice, nous allons générer une nouvelle sorte de canards en étendant la classe Duck actuelle.
Avant de commencer cette partie, assurez-vous d’avoir bien complété l’introduction et deuxième partie sur les canards, car nous utiliserons des éléments contenus dans celles-ci.
Quelques ajustements seront nécessaires sur la classe Duck avant de commencer.
Premièrement, créez une nouvelle méthode intitulée init sur cette classe.
Déplacez this.create() et l'écoute du clic sur le canard 🎯 à l'intérieur de votre nouvelle méthode.
À ce stade-ci, votre canard devrait arrêté d'être généré, car la méthode create n'est plus appelée dans le constructeur.
Requis
Dans votre classe Game, stockez l'instanciation de votre classe Duck dans une propriété nommée duck.
À partir de cette nouvelle propriété, appelez-la méthode init de Duck.
À partir de ce moment, vous devriez être de retour à votre point de départ, soit votre canard devrait afficher comme avant.
Après la classe Duck, créez-vous une nouvelle classe JavaScript intitulée BlueDuck étendant la classe Duck.
Appelez super dans son constructeur afin qu'elle génère une instance en appelant sa classe parent Duck.
Dans votre classe Game, remplacez new Duck() par new BlueDuck().
Si tout ce passe bien, votre classe BlueDuck devrait actuellement être identique à votre classe Duck donc aucun changement ne devrait-être perceptible.
Dans le constructeur de BlueDuck, définissez la valeur de speed à 3 afin de faire en sorte que ce canard vole plus vite.
Lorsque Super est utilisé dans un constructeur, il doit toujours être écrit en premier. Votre propriété doit donc être écrite après.
Copiez la méthode init de votre classe Duck et collez là dans votre classe BlueDuck. Ainsi, nous pourrons modifier cette méthode sans impacter l'originale dans Duck.
À l'intérieur de la méthode init de BlueDuck, ajoutez la classe blue au canard 🔵. Cette classe changera l'apparence du canard.
À ce stade-ci, votre canard devrait-être bleu plutôt que brun et se déplacer plus rapidement que votre première version du canard.
Dans la classe Game, remplacez la ligne this.duck = new BlueDuck(); par la condition suivante.
Si la propriété score à une valeur inférieure à 500, stockez dans votre propriété duck une instance de la classe Duck(Canard brun).
Si la propriété score à une valeur entre 500 et 1000, stockez aléatoirement dans votre propriété duck une instance de la classe Duck ou de BlueDuck. Ainsi, un canard brun ou bleu sera généré durant cette période.
Si la propriété score à une valeur supérieure à 1000, stockez dans votre propriété duck une instance de la classe BlueDuck(Canard bleu).
Bonus
Inspirez-vous de la classe CSS .duck.blue pour créer la classe .duck.red créant ainsi une 3e sorte de canard 🔴. Cette sorte devra utiliser l'image du canard rouge.
Lorsque le pointage se situe entre 1000 et 1500, pigez entre les canards bleus 🔵 et rouges 🔴.
Lorsque le pointage dépasse 1500, pigez entre les 3 sortes de canards.