Partage
  • Partager sur Facebook
  • Partager sur Twitter

Cours Apprenez à coder avec JavaScript

    8 mars 2018 à 11:46:48

    Bonjour,

    J'ai une anomalie dans le jeu de rôle du chapitre 8 sur la POO : la ligne "Glacius a tué ZogZog (...)" ne s'affiche pas.

    J'ai beau relire mon code, tout y est, la condition (adversaire.sante === 0) est respectée, mais pourtant, rien.

    Voici mon code :

    var Personnage = {
        // Initialise le personnage
        initPerso: function (nom, sante, force) {
            this.nom = nom;
            this.sante = sante;
            this.force = force;
        },
        // Attaque un personnage cible
        attaquer: function (cible) {
            if (this.sante > 0) {
                var degats = this.force;
                console.log(this.nom + " attaque " + cible.nom + " et lui fait " + degats + " points de dégâts.");
                cible.sante = cible.sante - degats;
                if (cible.sante > 0) {
                    console.log(cible.nom + " a encore " + cible.sante + " points de vie.");
                } else {
                    cible.sante = 0;
                    console.log(cible.nom + " est mort !");
                }
            } else {
                console.log(this.nom + " ne peut pas attaquer : il est mort ...");
            }
        }
    };
    
    var Joueur = Object.create(Personnage);
    // Initialise le joueur
    Joueur.initJoueur = function (nom, sante, force) {
        this.initPerso(nom, sante, force);
        this.xp = 0; // L'expérience du joueur est toujours initialisé à 0
    };
    // Renvoie la description du joueur
    Joueur.decrire = function () {
        var description = this.nom + " a " + this.sante + " points de vie, " + this.force + " en force et " + this.xp + " points d'expérience.";
        return description
    };
    // Combat un adversaire
    Joueur.combattre = function (adversaire) {
        this.attaquer(adversaire);
        if (adversaire.sante === 0) {
            console.log(this.nom + " a tué " + adversaire.nom + " et gagne " + adversaire.valeur + " points d'expérience");
            this.xp += adversaire.valeur;
        }
    };
    
    var Adversaire = Object.create(Personnage);
    // Initialise l'adversaire
    Adversaire.initAdversaire = function (nom, sante, force, race, valeur) {
        this.initPerso(nom, sante, force);
        this.race = race;
        this.valeur = valeur;
    };
    
    var joueur1 = Object.create(Joueur);
    joueur1.initJoueur("Aurora", 150, 25);
    
    var joueur2 = Object.create(Joueur);
    joueur2.initJoueur("Glacius", 130, 30);
    
    console.log("Bienvenue dans ce jeu d'aventure ! Voici nos courageux héros :");
    console.log(joueur1.decrire());
    console.log(joueur2.decrire());
    
    var monstre = Object.create(Adversaire);
    monstre.initAdversaire("ZogZog", 40, 20, "orc", 10);
    
    console.log("Un affreux monstre arrive : c'est un " + monstre.race + " nommé " + monstre.nom + ".");
    
    monstre.attaquer(joueur1);
    monstre.attaquer(joueur2);
    
    joueur1.attaquer(monstre);
    joueur2.attaquer(monstre);
    
    console.log(joueur1.decrire());
    console.log(joueur2.decrire());

    Merci par avance aux bonnes âmes qui pourront m'éclairer.

    • Partager sur Facebook
    • Partager sur Twitter
      8 mars 2018 à 14:14:15

      Bonjour, le problème viens de la ligne 72 et 73. Quand c'est le joueur qui combat c'est avec "combattre" et pas "attaquer".
      • Partager sur Facebook
      • Partager sur Twitter
        8 mars 2018 à 14:50:18

        NicolasSantiago a écrit:

        Bonjour, le problème viens de la ligne 72 et 73. Quand c'est le joueur qui combat c'est avec "combattre" et pas "attaquer".

        Merci :'(

        Bonjour,

        Merci de nouveau NicolasSantiago d'avoir relevé ma coquille.

        Je rencontre aujourd'hui un problème, cette fois-ci avec la fonction "decrire". Je m'explique : dans le chapitre 8 sur la POO, exercice "Compte bancaire", voici mon code pour initialiser les comptes, suivi du code donné dans le cours pour afficher l'état initial des comptes :

        var CompteBancaire = {
            // Initialise le compte bancaire
            initCB: function (titulaire, solde) {
                this.titulaire = titulaire;
                this.solde = solde;
            },
            // Description du compte
            decrire: function () {
                var description = "Titulaire : " + this.titulaire + ", solde : " + this.solde + " euros.";
                return description;
            }
        };
        
        var CompteEpargne = Object.create(CompteBancaire);
        // Initialise le compte épargne
        CompteEpargne.initCE = function (titulaire, solde, tauxInteret) {
            this.initCB(titulaire, solde);
            this.taux = tauxInteret;
        }
        
        var compte1 = Object.create(CompteBancaire);
        compte1.initCB("Alex", 100);
        var compte2 = Object.create(CompteEpargne);
        compte2.initCE("Marco", 50);
        
        console.log("Voici l'état initial des comptes :");
        console.log(compte1.decrire);
        console.log(compte2.decrire);

        Voici ce qu'affiche la console Firefox :

        Si je développe un peu l'arborescence, ça donne ceci :

        Rendu cette fois-ci au chapitre 9 sur les tableaux, avant-dernier exercice "Liste de films", voici mon code :

        var Film = {
            // Initialisation du film
            init: function(titre, annee, realisateur) {
            this.titre = titre;
            this.annee = annee;
            this.realisateur = realisateur;
            },
            // Renvoie la description du film
            decrire: function () {
                var description = this.titre + ", " + this.annee + ", " + this.realisateur;
                return description;
            }
        };
        
        // Création des films
        var film1 = Object.create(Film);
        film1.init("Casino", 1996, "Martin Scorsese");
        
        var film2 = Object.create(Film);
        film2.init= ("The big Lebowski", 1996, "Joël & Ethan Cohen");
        
        var film3 = Object.create(Film);
        film3.init("Citizen Kane", 1942, "Orson Welles");
        
        //Initialisation du tableau
        var Films = [];
        Films.push(film1);
        Films.push(film2);
        Films.push(film3);
        
        //Renvoie du tableau
        Films.forEach(function (film) {
            console.log(film);
        })
        J'ai le même rendu dans la console Firefox : elle affiche function decrire(). J'ai beau vérifier, la rédaction me semble bonne. Je n'ai pas trouvé de sujet équivalent, sur ce forum ou sur d'autres. J'ai ré-écrit mon code plusieurs fois en essayant de trouver des solutions, sans succès.

        Quelqu'un pourrait-il m'éclairer s'il-vous-plaît ?

        -
        Edité par Arudan 9 mars 2018 à 14:41:06

        • Partager sur Facebook
        • Partager sur Twitter
          14 mars 2018 à 10:33:12

          Petit retour rapide après avoir parcouru le cours.

          Points positifs (à mon gout) : c'est extrêmement porté sur les petits exercices pratiques, de difficulté graduelle et bien pensée. C'est excellent pour débuter.

          Points négatifs (à mon gout) : une spec de retard. Utilisation des var au lieu des let, qui risquent d'entrainer un débutant dans des comportements bizarres ou de perdre un connaisseur voulant se former sur ce langage. Les classes sont définies avec une syntaxe aujourd'hui archaïque et peu pratique à lire, comparée à la syntaxe class+constructor (même s'il est important de faire un point pour préciser que c'est du sucre syntaxique, que ça fonctionne par prototype, etc.)

          Le cours était probablement parfait il y a quelques années, mais il est peut-être venu le temps de le moderniser un peu... (ça ne représenterait pas beaucoup de travail, un seul chapitre serait à réécrire et les changements de var à let sont rapides) :)

          -
          Edité par Genroa 14 mars 2018 à 10:33:30

          • Partager sur Facebook
          • Partager sur Twitter
          /!\ Si je cesse de répondre c'est parce que vous êtes venus poster sans avoir suivi les cours de base sur le sujet. /!\
            15 mars 2018 à 9:07:03

            Bonjour,

            Malgré l'inactivité du forum, je retente ma chance : j'ai été bloqué à l'activité 2, où il est demandé d'écrire un gestionnaire de contact. J'avais rencontré le même problème lors d'un exercice précédent mais j'étais passé outre. J'ai simplifié mon code à sa plus simple expression pour mettre en valeur le problème :

            // Création du prototype Contact
            var Contact = {
            	// Initialise les attributs du répertoire
            	init: function(nom, prenom) {
            		this.nom = nom;
            		this.prenom = prenom;
            	},
            	// Renvoie la description
            	decrire: function () {
            		var description = ("Nom : " + this.nom + ", Prénom :" + this.prenom);
            		return description;
            	}
            };
            
            // Création des objets "contact" à partir du prototype
            var contact1 = Object.create(Contact);
            contact1.init("Lévisse", "Carole");
            
            var contact2 = Object.create(Contact);
            contact2.init("Nelsonne", "Mélodie");
            
            // Affichage des contacts
            console.log(contact1.decrire);
            console.log(contact2.decrire);

            Voici l'affichage dans la console Firefox (version Quantum 59.0) :

            Vous le constatez, la console ne renvoit pas la description du contact mais l'action demandée. J'ai vérifié la syntaxe sur des exemples précédents, elle me semble juste. J'ai créer d'autres exemples mais toujours le même constat : la commande "console.log(objet.decrire)" ne me renvoit jamais la description de l'objet mais affiche l'action demandée.

            Après avoir écumé le forum et d'autres sources d'information, je ne trouve aucune solution. Me voilà donc dans l'impossibilité de valider le cours...

            Au secours !

            • Partager sur Facebook
            • Partager sur Twitter
              15 mars 2018 à 9:49:18

              Ton problème vient du fait que tu demandes à la console de te donner une description de la fonction decrire, dans la classe Contact. Pour obtenir le résultat de celle-ci, il faut l'appeler:

              console.log(contact1.decrire());

               Démonstration dans la console:

              decrire est une méthode de la classe, pas un champ. :)


              Le cours n'en fait pas mention, mais une syntaxe moderne pour écrire la classe Contact serait:

              class Contact {
                  // Initialise les attributs du répertoire
                  constructor(nom, prenom) {
                      this.nom = nom;
                      this.prenom = prenom;
                  }
              
                  // Renvoie la description
                  decrire() {
                      var description = ("Nom : " + this.nom + ", Prénom :" + this.prenom);
                      return description;
                  }
              }



              Et on créerait des objets Contact de cette manière:

              var contact1 = new Contact("Lévisse", "Carole");

              Ça évite d'avoir à appeler manuellement une fonction init. :)

              (source: classes en Javascript sur MDN)


              -
              Edité par Genroa 15 mars 2018 à 9:56:02

              • Partager sur Facebook
              • Partager sur Twitter
              /!\ Si je cesse de répondre c'est parce que vous êtes venus poster sans avoir suivi les cours de base sur le sujet. /!\
                15 mars 2018 à 12:54:41

                Genroa a écrit:

                Ton problème vient du fait que tu demandes à la console de te donner une description de la fonction decrire, dans la classe Contact. Pour obtenir le résultat de celle-ci, il faut l'appeler:

                console.log(contact1.decrire());

                 Démonstration dans la console:

                decrire est une méthode de la classe, pas un champ. :)


                Le cours n'en fait pas mention, mais une syntaxe moderne pour écrire la classe Contact serait:

                class Contact {
                    // Initialise les attributs du répertoire
                    constructor(nom, prenom) {
                        this.nom = nom;
                        this.prenom = prenom;
                    }
                
                    // Renvoie la description
                    decrire() {
                        var description = ("Nom : " + this.nom + ", Prénom :" + this.prenom);
                        return description;
                    }
                }



                Et on créerait des objets Contact de cette manière:

                var contact1 = new Contact("Lévisse", "Carole");

                Ça évite d'avoir à appeler manuellement une fonction init. :)

                (source: classes en Javascript sur MDN)


                -
                Edité par Genroa il y a environ 1 heure

                Aaahhhh ! Mais quel c*!$%? !! Comment ai-je pu passer à côté ??

                Merci à toi Genroa. :D Concernant la syntaxe datée, je suis surpris, il est pourtant noté que le cours est régulièrement mis à jour. Je pense quand même que tout ce que j'ai assimilé concernant la "mécanique" JS me sera utile.



                • Partager sur Facebook
                • Partager sur Twitter
                  15 mars 2018 à 14:32:19

                  La syntaxe proposée est celle de la spécification ES5 (2009), alors que la spécification ES6 (2015) est déjà bien supportée par les navigateurs modernes (ils gèrent même plutôt bien ES7 et les API plus récentes encore). Il n'y a aucune raison de rester sur du ES5 je pense (à moins que l'auteur ait une bonne raison à laquelle je n'aie pas pensé), sinon c'est juste que non le cours n'est pas régulièrement remis à jour.

                  -
                  Edité par Genroa 15 mars 2018 à 14:33:46

                  • Partager sur Facebook
                  • Partager sur Twitter
                  /!\ Si je cesse de répondre c'est parce que vous êtes venus poster sans avoir suivi les cours de base sur le sujet. /!\
                    17 mars 2018 à 0:03:16

                    Salut la compagnie, pour l’activité un , j'ai choisi une boucle for.

                    Cela fonctionne mais évidemment il y a un Mais pas encore tout a fait.

                    Si une des conditions est prise en compte, la boucle continue mais sans se préoccuper des chiffres que je mets par la suite ! POURQUOI ?

                    /* 
                    Activité : jeu de devinette
                    Content: devinette.html & devinette.js
                    */
                    
                    // NE PAS MODIFIER OU SUPPRIMER LES LIGNES CI-DESSOUS
                    // COMPLETEZ LE PROGRAMME UNIQUEMENT APRES LE TODO
                    
                    console.log("Bienvenue dans ce jeu de devinette !");
                    
                    // Cette ligne génère aléatoirement un nombre entre 1 et 100
                    var solution = Math.floor(Math.random() * 100) + 1;
                    // TODO : complétez le programme
                    
                    //Donne le numéro a deviner !
                    alert(solution);
                    
                    //Fais deviner un chiffre au joueur
                    var stringGuess = prompt("Tape un chiffre entre 1 et 100 !");
                    var guess = Number(stringGuess);
                    var nbTours = 0;
                    //Utiliser une variable pour relancer le jeu ou bien une fonction ?
                    
                    
                    //Boucle for pour limiter a six tentatives pour trouver le nombre.
                    
                    	for (nbTours = 1; nbTours <= 6; nbTours++){
                    		
                    		// Cas le chiffre est plus grand que ...
                    		if(guess > solution){
                    				console.log(stringGuess + " est trop grand");
                    				alert(stringGuess + " est trop grand.  Devine encore!");
                    				//Objectif relancer le choix pour le joueur tant que true,(le chiffre a deviner) n'est pas valider !
                    				 
                    				prompt("Tape un chiffre entre 1 et 100 !");
                    		} //Valide mais la relance ne fonctionne pas !
                    
                    			//Cas le chiffre est plus petit que ...
                    			else if(guess < solution){
                    				console.log(stringGuess + " est trop petit");
                    				alert(stringGuess +	" est trop petit.  Devine encore!");
                    				//Objectif relancer le choix pour le joueur tant que true,(le chiffre a deviner) n'est pas valider !
                    				prompt("Tape un chiffre entre 1 et 100 !");
                    			} //Valide mais la relance ne fonctionne pas !
                    
                    					//Cas le chiffre est = a la solution
                    					else if(guess === solution){
                    						console.log("Bravo ! La solution était " + solution );
                    						//Calcul du nombre de tours effectués avant de trouver
                    						console.log("Vous avez trouvé en " + nbTours + " essai(s)");
                    						alert("Bravo ! La solution était " + solution );
                    						break;
                    						} //Valider
                    
                    				// Cas le joueur depasse le nombre de tours 
                    				else if(guess === nbTours){
                    					console.log("Perdu... La solution était " + solution);
                    					break;
                    				// Autre cas
                    				} else {
                    					alert("Si vous souhaitez relancer le jeu, tapez sur la touche F5 !");
                    				}
                    
                    		 
                    	} //Fin de boucle
                    //}// Fin de fonction
                    //Valider
                    //Utile pour savoir le nombre de tours effectuer !
                    console.log(nbTours);
                    
                    //la boucle se fait dans le jeu mais si une seule condition est validée, elle ne prends pas en compte les autres choix du joueur !
                    
                    



                    • Partager sur Facebook
                    • Partager sur Twitter
                    Dev Front and back-end et mobile Android. "L’éducation est la priorité absolue de toutes sociétés dites civilisées !" PR
                      17 mars 2018 à 1:32:39

                      Bonsoir, c'est peut être parce-que les "prompt" dans ta boucle ne revoient a aucune variable contrairement à la ligne 19.
                      • Partager sur Facebook
                      • Partager sur Twitter
                        17 mars 2018 à 15:52:29

                        pashlord a écrit:

                        Salut la compagnie, pour l’activité un , j'ai choisi une boucle for.

                        Cela fonctionne mais évidemment il y a un Mais pas encore tout a fait.

                        Si une des conditions est prise en compte, la boucle continue mais sans se préoccuper des chiffres que je mets par la suite ! POURQUOI ?

                        /* 
                        Activité : jeu de devinette
                        Content: devinette.html & devinette.js
                        */
                        
                        // NE PAS MODIFIER OU SUPPRIMER LES LIGNES CI-DESSOUS
                        // COMPLETEZ LE PROGRAMME UNIQUEMENT APRES LE TODO
                        
                        console.log("Bienvenue dans ce jeu de devinette !");
                        
                        // Cette ligne génère aléatoirement un nombre entre 1 et 100
                        var solution = Math.floor(Math.random() * 100) + 1;
                        // TODO : complétez le programme
                        
                        //Donne le numéro a deviner !
                        alert(solution);
                        
                        //Fais deviner un chiffre au joueur
                        var stringGuess = prompt("Tape un chiffre entre 1 et 100 !");
                        var guess = Number(stringGuess);
                        var nbTours = 0;
                        //Utiliser une variable pour relancer le jeu ou bien une fonction ?
                        
                        
                        //Boucle for pour limiter a six tentatives pour trouver le nombre.
                        
                        	for (nbTours = 1; nbTours <= 6; nbTours++){
                        		
                        		// Cas le chiffre est plus grand que ...
                        		if(guess > solution){
                        				console.log(stringGuess + " est trop grand");
                        				alert(stringGuess + " est trop grand.  Devine encore!");
                        				//Objectif relancer le choix pour le joueur tant que true,(le chiffre a deviner) n'est pas valider !
                        				 
                        				prompt("Tape un chiffre entre 1 et 100 !");
                        		} //Valide mais la relance ne fonctionne pas !
                        
                        			//Cas le chiffre est plus petit que ...
                        			else if(guess < solution){
                        				console.log(stringGuess + " est trop petit");
                        				alert(stringGuess +	" est trop petit.  Devine encore!");
                        				//Objectif relancer le choix pour le joueur tant que true,(le chiffre a deviner) n'est pas valider !
                        				prompt("Tape un chiffre entre 1 et 100 !");
                        			} //Valide mais la relance ne fonctionne pas !
                        
                        					//Cas le chiffre est = a la solution
                        					else if(guess === solution){
                        						console.log("Bravo ! La solution était " + solution );
                        						//Calcul du nombre de tours effectués avant de trouver
                        						console.log("Vous avez trouvé en " + nbTours + " essai(s)");
                        						alert("Bravo ! La solution était " + solution );
                        						break;
                        						} //Valider
                        
                        				// Cas le joueur depasse le nombre de tours 
                        				else if(guess === nbTours){
                        					console.log("Perdu... La solution était " + solution);
                        					break;
                        				// Autre cas
                        				} else {
                        					alert("Si vous souhaitez relancer le jeu, tapez sur la touche F5 !");
                        				}
                        
                        		 
                        	} //Fin de boucle
                        //}// Fin de fonction
                        //Valider
                        //Utile pour savoir le nombre de tours effectuer !
                        console.log(nbTours);
                        
                        //la boucle se fait dans le jeu mais si une seule condition est validée, elle ne prends pas en compte les autres choix du joueur !
                        
                        





                        -
                        Edité par pashlord 17 mars 2018 à 16:02:13

                        • Partager sur Facebook
                        • Partager sur Twitter
                        Dev Front and back-end et mobile Android. "L’éducation est la priorité absolue de toutes sociétés dites civilisées !" PR
                          21 mars 2018 à 16:21:36

                          Intéressant ce petit tuto.

                          Il m'a fait prendre encore plus l'intérêt de réfléchir AVANT de coder !

                          et j'ai fini ainsi mon exercice_2 - Contacts -

                          document.write(" <br /> Vous avez bien noté les références des adhérents du Club ??? <br />");
                          monRepertoireDuClub.forEach(function (adherent) {
                              document.write(adherent.decrire() + " <br/>");
                          });
                          document.write(" <br />--------------------------------------- <br />");
                          document.write(" Dommage qu'après il n'est pas sauvegardé, le fichier modifié !");
                          document.write(" <br /> On le verra dans le prochain tuto !  ;-}  <br />");
                          document.write(" <br />--------------------------------------- <br />");
                          
                          // ************************************************************

                          Bon, j'ai corrigé 3 exos qui m'ont fait bien voir que chacun code à sa façon et que ça marche quand même !

                          J'ai donc eu mes résultats.

                          Mais le "Diplôme", on l'a comment ?

                          -
                          Edité par jadu29 22 mars 2018 à 15:32:32

                          • Partager sur Facebook
                          • Partager sur Twitter

                          Toujours à l'écoute, comme tout marin ! ... et ... prenez bien soin de vous !

                            23 mars 2018 à 21:06:40

                            Bonjour, 

                            Je programme avec le second cours de javascript et je suis au moment ou l'on soumet le formulaire. j'ai une erreur de codage alors que j'ai recopié dans un premier temps le cours. Ne trouvant pas l'erreur j'ai copié/collé le codage du cours et j'ai toujours la même erreur. Pouvez vous m'aidez s'il vous plait?

                            Codage HTML:

                            <!doctype html>

                            <html>

                            <head>

                                <meta charset="utf-8">

                                <title>Manipulation des formulaires</title>

                            </head>

                            <body>

                                <form>

                                    <h1>Formulaire d'inscription</h1>

                                    <p>

                                        <label for="pseudo">Pseudo</label> :

                                        <input type="text" name="pseudo" id="pseudo" required>

                                        <span id="aidePseudo"></span>

                                    </p>

                                    <p>

                                        <label for="mdp">Mot de passe</label> :

                                        <input type="password" name="mdp" id="mdp" required>

                                        <span id="aideMdp"></span>

                                    </p>

                                    <p>

                                        <label for="courriel">Courriel</label> :

                                        <input type="email" name="courriel" id="courriel" required placeholder="utilisateur@domaine.fr">

                                        <span id="aideCourriel"></span>

                                    </p>

                                    <p>

                                        <input type="checkbox" name="confirmation" id="confirmation">

                                        <label for="confirmation">M'envoyer un courriel de confirmation</label>

                                    </p>

                                    <p>

                                        <input type="radio" name="abonnement" id="abonewspromo" value="abonewspromo">

                                        <label for="abonewspromo">M'abonner à la newsletter et aux promotions</label>

                                        <br>

                                        <input type="radio" name="abonnement" id="abonews" value="abonews">

                                        <label for="abonews">M'abonner uniquement à la newsletter</label>

                                        <br>

                                        <input type="radio" name="abonnement" id="aborien" value="aborien" checked>

                                        <label for="aborien">Ne pas m'abonner</label>

                                        <br>

                                    </p>

                                    <p>

                                        <label for="nationalite">Nationalité :</label>

                                        <select name="nationalite" id="nationalite">

                                            <option value="FR" selected>Française</option>

                                            <option value="BE">Belge</option>

                                            <option value="SUI">Suisse</option>

                                            <option value="XX">Autre</option>

                                        </select>

                                    </p>

                                    <input type="submit" value="Envoyer">

                                    <input type="reset" value="Annuler">

                                </form>

                                <script src="../JAVASCRIPT/Manipulez les formulaires.js"></script>

                            </body>

                            </html>

                            Codage Javascript:

                            //Affichage de toutes les données saisies ou choisies

                            form.addEventListener("submit", function (e) {

                            var pseudo = form.elements.pseudo.value;

                            var mdp = form.elements.mdp.value;

                            var courriel = form.elements.courriel.value;

                            console.log("Vous avez choisi le pseudo " + pseudo + ", le mot de passe " + mdp + " et le courriel " + courriel);

                            if (form.elements.confirmation.checked) {

                            console.log("Vous avez demandé une confirmation d'inscription par courriel");

                            } else {

                            console.log("Vous n'avez pas demandé de confirmation d'inscription par courriel");

                            }

                            switch (form.elements.abonnement.value) {

                            case "abonewspromo":

                            console.log("Vous êtes abonné(e) à la newsletter et aux promotions");

                            break;

                            case "abonews":

                            console.log("Vous êtes abonné(e) à la newsletter");

                            break;

                            case "aborien":

                            console.log("Vous n'êtes abonné(e) à rien");

                            break;

                            default:

                            console.log("Erreur : code d'abonnement non reconnu");

                            break;

                            }

                            switch (form.elements.nationalite.value) {

                            case "FR":

                            console.log("Vous êtes français(e)");

                            break;

                            case "BE":

                            console.log("Vous êtes belge");

                            break;

                            case "SUI":

                            console.log("Vous êtes suisse");

                            break;

                            default:

                            console.log("Erreur : code de nationalité non reconnu");

                            break;

                            }

                            e.preventDefault(); // Annulation de l'envoi des données

                            });

                            L'erreur signalé sur mozilla:

                            ReferenceError: form is not defined.

                            merci pour votre aide.

                            • Partager sur Facebook
                            • Partager sur Twitter
                              24 mars 2018 à 13:25:42

                              Bonjour,

                              j'ai un problème au niveau de l'organisation des fichier sur ma machine.Je viens de commencer,mais au niveau des instruction pour la creation de repertoire j'ai suivi toutes les instruction mais voila Jslint detecte trois erreurs pour la ligne de code suivante:

                              console.log("Bonjour en javascript" !);

                              problemes

                               console was used before it was defined

                              Veuillez bien m'aider a passer l'etape.merci

                              • Partager sur Facebook
                              • Partager sur Twitter
                                25 mars 2018 à 21:03:28

                                Bonjour,

                                j'essaie de faire (ou plutôt refaire) l'activité à la fin de la première partie du tutoriel avec des modifications juste pour m'entraîner. Au lieu d'afficher les résultats dans la console, j'affiche tout directement dans la page. J'en suis à tester si le résultat rentré correspond au nombre choisi par l'ordinateur. Quand je saisi le bon nombre, au lieu d'afficher "Bravo vous avez gagné", ça affiche "nombre est trop grand".

                                Voici mon code :

                                HTML :

                                <!DOCTYPE html>
                                <html>
                                  <head>
                                    <meta charset="utf-8" />
                                    <title>Jeu de devinette</title>
                                  </head>
                                
                                  <body>
                                    <h1>Bienvenue dans ce jeu de devinette !</h1>
                                
                                    <form method="post">
                                      <div>
                                        <label for="nombre">Saisissez un nombre entre 1 et 100 :</label>
                                        <input type="number" id="nombre" name="nombre" placeholder="Saisissez un nombre entre 1 et 100 :" min="1" max="100" />
                                      </div>
                                      <div>
                                        <button type="submit">OK</button>
                                        <button type="reset">Annuler</button>
                                      </div>
                                    </form>
                                
                                    <p></p>
                                
                                    <section></section>
                                
                                    <script src="../js/devinette.js"></script>
                                  </body>
                                </html>
                                

                                JavaScript :

                                /*
                                Activité : jeu de devinette
                                */
                                
                                "use strict"; // Mode strict du JavaScript.
                                
                                /*************************************************************************************************/
                                /* ****************************************** DONNEES ****************************************** */
                                /*************************************************************************************************/
                                
                                // Cette ligne génère aléatoirement un nombre entre 1 et 100
                                var solution = Math.floor( Math.random() * 100 ) + 1;
                                var nombre = Number( document.getElementById("nombre").value );
                                
                                
                                /*************************************************************************************************/
                                /* ***************************************** FONCTIONS ***************************************** */
                                /*************************************************************************************************/
                                
                                
                                
                                /*************************************************************************************************/
                                /* ************************************** CODE PRINCIPAL *************************************** */
                                /*************************************************************************************************/
                                
                                document.addEventListener("DOMContentLoaded", function()
                                {
                                  // Décommentez temporairement cette ligne pour mieux vérifier le programme
                                  console.log("(La solution est " + solution + ")");
                                
                                  document.forms[0].addEventListener("reset", function()
                                  {
                                    document.querySelector("p").innerText = "Vous devez envoyer un résultat.";
                                    document.querySelector("section").innerHTML = "";
                                  });
                                
                                  document.forms[0].addEventListener("submit", function(event)
                                  {
                                    event.preventDefault();
                                
                                    console.log(typeof solution); // Affiche : number
                                    console.log(typeof nombre); // Affiche : number
                                    console.log(solution === nombre); // Affiche : false, comment (number === number) peut retourner false ???
                                
                                    if ( document.getElementById("nombre").value < 1 )
                                    {
                                      document.querySelector("p").innerText = "Vous devez compléter tous les champs avant d'envoyer le formulaire.";
                                			document.querySelector("section").innerHTML = "";
                                    }
                                    else
                                    {
                                      document.querySelector("p").innerText = "";
                                      if ( document.getElementById("nombre").value !== solution )
                                      {
                                        document.querySelector("section").innerHTML += "<p>" + document.getElementById("nombre").value + " est trop " + (document.getElementById("nombre").value < solution ? "petit" : "grand") + "</p>";
                                      }
                                      else
                                      {
                                        document.querySelector("section").innerHTML += "<p>Bravo ! La solution était " + solution + "</p>";
                                        document.querySelector("section").innerHTML += "<p>Vous avez trouvé en " + solution + " essai " + (nombreEssais > 1 ? "s" : "") + "</p>";
                                      }
                                    }
                                  });
                                });
                                

                                En testant avec console.log, lignes 41 42 et 43, ça devrait afficher "vous avez gagné" puisqu'à la ligne 13, j'ai converti la valeur saisi en valeur de type number.

                                Est-ce que quelqu'un a une idée.

                                Merci d'avance pour votre aide.

                                • Partager sur Facebook
                                • Partager sur Twitter
                                  27 mars 2018 à 0:12:56

                                  @me_moi

                                  Relit les fonctionnalités il n'est pas demander d'utiliser un formulaire !

                                  @+

                                  • Partager sur Facebook
                                  • Partager sur Twitter
                                  Dev Front and back-end et mobile Android. "L’éducation est la priorité absolue de toutes sociétés dites civilisées !" PR
                                    27 mars 2018 à 0:36:00

                                    Je sais, mais c'est juste pour l'entraînement.
                                    • Partager sur Facebook
                                    • Partager sur Twitter
                                      27 mars 2018 à 10:43:19

                                      Bonjour,

                                      J'ai totalement fini le cours, j'ai reçu les résultats pour le dernier exercice, mais je m'inquiète un peu de ne toujours pas avoir eu le résultat pour le 1er exercice.

                                      Le dernier exercice à été corrigé en moins d'une heure par 3 personnes, pour le premier exercice il me manque 1 note et ça fait 1 jour et demi que je l'ai fini.

                                      Dois-je faire quelque chose où juste attendre encore?

                                      Merci :-)

                                      Laurent

                                      Edit : Rien dit, c'est bon j'ai reçu la note.. Ahh la la pas de patience :-)

                                      -
                                      Edité par Laurent Cipicchia 27 mars 2018 à 12:05:51

                                      • Partager sur Facebook
                                      • Partager sur Twitter
                                      Donne moi ton avis sur ma Reconversion professionnel en Développeur Web ----- Rejoins moi sur LinkedIn
                                        28 mars 2018 à 12:52:30

                                        Pour le fun, j'ai essayé de refaire la première activité mais sans utiliser la console et en affichant tout dans la page.

                                        Voici le javascript - le html a déjà été posté plus haut.

                                        /*
                                        Activité : jeu de devinette
                                        */
                                        "use strict"; // Mode strict du JavaScript.
                                        
                                        /*************************************************************************************************/
                                        /* ****************************************** DONNEES ****************************************** */
                                        /*************************************************************************************************/
                                        // Cette ligne génère aléatoirement un nombre entre 1 et 100
                                        var solution = Math.floor( Math.random() * 100 ) + 1;
                                        var nombreEssais = 0;
                                        
                                        /*************************************************************************************************/
                                        /* ***************************************** FONCTIONS ***************************************** */
                                        /*************************************************************************************************/
                                        function timer()
                                        {
                                          window.setTimeout( function()
                                          {
                                            window.location.reload();
                                          }, 2000 );
                                        }
                                        
                                        
                                        /*************************************************************************************************/
                                        /* ************************************** CODE PRINCIPAL *************************************** */
                                        /*************************************************************************************************/
                                        document.addEventListener("DOMContentLoaded", function()
                                        {
                                          document.forms[0].addEventListener("reset", function()
                                          {
                                            document.querySelector("p").innerText = "Vous devez envoyer un résultat.";
                                            document.querySelector("section").innerHTML = "";
                                            document.querySelector("button[type=submit]").disabled = false;
                                            nombreEssais = 0;
                                          });
                                        
                                          document.forms[0].addEventListener("submit", function(event)
                                          {
                                            event.preventDefault();
                                        
                                            document.querySelector("button[type=submit]").disabled = true;
                                        
                                            if ( Number(document.getElementById("nombre").value.trim()) < 1 )
                                            {
                                              document.querySelector("p").innerText = "Vous devez compléter tous les champs avant d'envoyer le formulaire.";
                                        			document.querySelector("section").innerHTML = "";
                                            }
                                            else
                                            {
                                              document.querySelector("p").innerText = "";
                                        
                                              nombreEssais++;
                                        
                                              if (nombreEssais <= 6)
                                              {
                                                if ( Number(document.getElementById("nombre").value.trim()) !== solution )
                                                {
                                                  document.querySelector("section").innerHTML += "<p>" + Number(document.getElementById("nombre").value.trim()) + " est trop " + ( Number(document.getElementById("nombre").value.trim()) < solution ? "petit" : "grand" ) + "</p>";
                                                }
                                                else
                                                {
                                                  document.querySelector("section").innerHTML += "<p>Bravo ! La solution était " + solution + "</p>";
                                                  document.querySelector("section").innerHTML += "<p>Vous avez trouvé en " + nombreEssais + " essai" + (nombreEssais > 1 ? "s" : "") + "</p>";
                                                  document.querySelector("button[type=submit]").disabled = true;
                                                  document.getElementById("nombre").value = "";
                                                  nombreEssais = 0;
                                                  timer();
                                                }
                                              }
                                              else
                                              {
                                                document.querySelector("section").innerHTML += "<p>Perdu... La solution était " + solution + "</p>";
                                                nombreEssais = 0;
                                                document.querySelector("button[type=submit]").disabled = true;
                                                document.getElementById("nombre").value = "";
                                                timer();
                                              }
                                            }
                                          });
                                        
                                          document.getElementById("nombre").addEventListener("click", function()
                                          {
                                            document.querySelector("button[type=submit]").disabled = false;
                                        
                                            if (nombreEssais === 0)
                                            {
                                              document.querySelector("section").innerHTML = "";
                                            }
                                          });
                                        });
                                        

                                        Je poste le code pour ceux que ça intéresse, et si vous avez des commentaires ou idées d'améliorations...

                                        • Partager sur Facebook
                                        • Partager sur Twitter
                                          28 mars 2018 à 19:55:55

                                          ?> a rajouter dans les 2 fichiers .php qui sont a copier dans le localhost/javascriptwebsrv... ;):ange:

                                          -
                                          Edité par MickaelCohen1 30 mars 2018 à 1:14:07

                                          • Partager sur Facebook
                                          • Partager sur Twitter
                                            29 mars 2018 à 12:51:16

                                            ...

                                            -
                                            Edité par NicolasLoh 31 mars 2018 à 2:16:40

                                            • Partager sur Facebook
                                            • Partager sur Twitter
                                              29 mars 2018 à 22:52:37

                                              Bonjour à toutes et à tous :)

                                              Je viens de finir le parcours, il est plutôt sympa mais j'ai quand même deux trois points a lui reprocher, dans la partie ou on nous apprend a faire des objets, on nous montre deux manières de faire, la première étant celle ci :

                                              var stylo = {

                                                  type: "bille",

                                                  couleur: "bleu",

                                                  marque: "Bic"

                                              };

                                              et la deuxieme, en utilisant un constructeur (ce qui donnerait) :

                                              function    Stylo() 

                                              {

                                                     this.type = "bille";

                                                     this.couleur = "bleue";

                                                     this.marque = "bic";

                                              }

                                              var     stylo = new Stylo();

                                              premièrement, l exemple avec le constructeur n'est pas assez détaillé dans le cours, j'ai galérer a le faire fonctionner car la syntaxe est différente, de ce fait tout le monde quasiment doit surement utiliser la première méthode (que je trouve pas très belle d ailleurs mais ça ne regarde que moi) et comme dans la suite du cours tout les exemples sont fait avec la première méthode,  2 élevés sur 3 m'ont mit en commentaire que je n'avais pas d'objet dans mon dernier exercice... Ça pose 2 problèmes, le premier c est que 2 étudiants sur 3 ne sont pas capable de reconnaître des objets quand il y'en a (alors que ma façon de faire vient du même cours), et en plus je n'ai pas eu tout les points xD

                                              C est ce que je reproche un peu a ce tuto, de temps en temps on évoque d'autres manières de faire des choses sans rentrer assez dans le détail, c est comme si on nous montrait en pseudo code que ça existe mais ça manque de précision pour pouvoir l appliquer.

                                              A part ça, ça s'est bien passé, Bon courage a ceux qui passent la certif ! :)

                                              -
                                              Edité par yetouf 29 mars 2018 à 22:53:17

                                              • Partager sur Facebook
                                              • Partager sur Twitter
                                                30 mars 2018 à 16:02:15

                                                Bonjour à tous,

                                                Je suis ce cours et je suis actuellement au chapitre intitulé

                                                Modularisez votre code grâce aux fonctions

                                                Sur l'exercice carré d'un nombre à améliorer, j'ai fait ceci:

                                                // Renvoie le carré d'un nombre
                                                function carre() {
                                                    // TODO : compléter le code de la fonction
                                                    for (var i = 1; i <= 10; i++) {
                                                        var result = Math.pow(i,2);
                                                        console.log("Le carré de " + i + " est " + result);
                                                    }
                                                }
                                                  
                                                console.log("Carré des nombres compris entre 0 et 10.");
                                                console.log(carre());
                                                console.log("Fin du programme"); 

                                                Mais à la fin de ma boucle j'ai un "undefined", pourquoi ?

                                                Apparemment il réalise une action supplémentaire qui n'est pas exécuté.

                                                Bien à vous,

                                                Lordaker

                                                -
                                                Edité par arnoldwk 30 mars 2018 à 16:50:37

                                                • Partager sur Facebook
                                                • Partager sur Twitter

                                                We build buildings developers...

                                                  30 mars 2018 à 16:29:11

                                                  Peut-être parce que tu ne fais pas un return de ta variable result, ou du message que tu affiches avec console.log
                                                  • Partager sur Facebook
                                                  • Partager sur Twitter
                                                    30 mars 2018 à 16:45:20

                                                    me_moi a écrit:

                                                    Peut-être parce que tu ne fais pas un return de ta variable result, ou du message que tu affiches avec console.log


                                                    il est vrai que dans la correction (voir ici), il y a un "return" dans la fonction.

                                                    Et en faisant ceci ça fonctionne mieux:

                                                    // Renvoie le carré d'un nombre
                                                    function carre(i) {
                                                        // TODO : compléter le code de la fonction
                                                        var result = Math.pow(i,2);
                                                        console.log("Le carré de " + i + " est :");
                                                        return result;
                                                    }
                                                    
                                                    
                                                    console.log("Carré des nombres compris entre 0 et 10.");
                                                    for(var i = 0; i <= 10; i++) {
                                                        console.log(carre(i));
                                                    }
                                                    
                                                    console.log("Fin du programme");



                                                    -
                                                    Edité par arnoldwk 30 mars 2018 à 17:00:44

                                                    • Partager sur Facebook
                                                    • Partager sur Twitter

                                                    We build buildings developers...

                                                      2 avril 2018 à 11:24:02

                                                      Bonjour je ne comprends pas pourquoi dans la partie TP: Un formulaire interarctif sur le cour de javascript en 40h(https://openclassrooms.com/courses/dynamisez-vos-sites-web-avec-javascript/tp-un-formulaire-interactif-1),pourquoi l'argument (elements) de la function getTooltip(elements) prend en argument <input> actuellement en cours de traitement comme dit dans la correction?Merci pour vos réponses.
                                                      • Partager sur Facebook
                                                      • Partager sur Twitter
                                                        2 avril 2018 à 12:03:58

                                                        Il te suffit pour cela de regarder le code de la fonction getTooltip. Il y a une boucle while dont la condition est de vérifier si l'élément passé en argument lors de l'appel à la fonction a un élément frère avec nextSibling ? Si c'est le cas, cet élément frère est affecté au paramètre element et remplacer la valeur précédent de l'argument. Ensuite, à l'intérieur de la boucle, on fait un deuxième test avec if. Si cet élément frère affecté au paramètre element a la classe tooltip, on retourne cet élément. Pour bien comprendre, tapes toi-même le code et aussi, regardes les explications de la fonction.

                                                        -
                                                        Edité par me_moi 2 avril 2018 à 12:05:30

                                                        • Partager sur Facebook
                                                        • Partager sur Twitter
                                                          2 avril 2018 à 13:27:46

                                                          Merci pour ta réponse mais je ne comprends toujours pas comment l'argument de la fonction getTooltip qui est element est remplacer par <input>.J'ai du rater rater un truc.La correction dit "Notre fonction prend en argument l'<input> actuellement en cours de traitement.
                                                          • Partager sur Facebook
                                                          • Partager sur Twitter
                                                            2 avril 2018 à 13:54:13

                                                            Ta question semble concerner le fonctionnement des fonctions de manière générale. Quand tu crées une fonction, les informations entre parenthèses s'appellent des paramètres (ou paramètres formels), alors que quand tu y fais appel, les informations entre parenthèses s'appellent des arguments (ou paramètres effectifs). Les arguments (lors de l'appel) sont passés aux paramètres de la fonction. Tu peux donner le nom que tu veux aux paramètres de ta fonction lorsque tu la crées : toto, babane, caramel, superman, element....

                                                            Tout ceci est expliqué ici.

                                                            -
                                                            Edité par me_moi 2 avril 2018 à 13:56:17

                                                            • Partager sur Facebook
                                                            • Partager sur Twitter
                                                              2 avril 2018 à 13:57:29

                                                              Oui tu as raison je vais revoir mon cour sur les fonctions merci pour ton aide!!
                                                              • Partager sur Facebook
                                                              • Partager sur Twitter

                                                              Cours Apprenez à coder avec JavaScript

                                                              × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                                                              × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                                                              • Editeur
                                                              • Markdown