Bonjour !

Je suis complètement débutant

en JavaScript, et j'ai un soucis avec la toute dernière activité du cours Apprenez à programmer avec JavaScript qui consiste à aider à créer une application de suivi de livres pour les lecteurs !

Voici l'énoncé :

"Dans le fichier Book.js, créez une classe Book.

La classe doit comporter les champs suivants :

• title: le titre du livre (string)
• author: l'auteur du livre (string)
• pages: le nombre total de pages (number)
• description: une description courte du livre (string)
• currentPage: la page à laquelle l'utilisateur s'est arrêté (number, valeur de 1 par défaut)
• read: si l'utilisateur a terminé le livre ou non (boolean)

La classe Book nécessite une méthode instance readBook qui prend un numéro de page (number) en argument. Cette méthode sera appelée pour que l'utilisateur puisse signaler à quelle page il s'est arrêté.

• si le numéro de page n'est pas valable, prévenir l'utilisateur et ne pas changer les valeurs des propriétés de l'instance
• sinon, donnez la valeur de l'argument reçu à la propriété currentPage
• si la valeur de currentPage est la dernière page du livre, le livre est considéré comme read (lu)

Maintenant, dans database.js, créez trois ou quatre instances de la classe Book à l'aide du mot-clé new.

Créez un tableau bookList qui contient toutes ces instances."

Voici ce que j'ai fait :

Fichier : Book.js

class Book {
  constructor (title, author, pages, description, currentPage = 1, read) {
    this.title = title;
    this.author = author;
    this.pages = pages;
    this.description = description;
    this.currentPage = currentPage;
    this.read = read;
  }
  readBook (number) {
    if (this.currentPage <= 0 || this.currentPage > this.pages){
    console.log("Attention, numéro de page invalide.");
    } else if (this.currentPage < this.pages) {
      this.currentPage = number;
    } else if (this.pages === this.currentPage) {
      this.read = true;
    }
  }
}

export { Book};

Fichier database.js

import { Book } from './Book.js';

const firstBook = new Book ('Naruto', 'Masashi Kishimoto', 50, 'Aventure fiction, Fantastique, Arts martiaux');
const secondBook = new Book ('One piece', 'Eiichiro Oda', 60, 'Aventure fiction, Fantastique, Arts martiaux');
const thirdBook = new Book ('One punch', 'One', 20, 'Aventure fiction, Fantastique, Arts martiaux');
const fourthBook = new Book ('harry potter', 'JK Rowling', 55, 'Fantastique, Fiction, Drame, Roman adulte, Mystère, Thriller, Bildungsroman');

let bookList = [ firstBook, secondBook, thirdBook, fourthBook ];

export { bookList };

les tableaux affiche tres bien mais, il m'affiche pas quand mes books sont tous lue et quand il y a une erreur de page. Si quelqu'un peux m'aidez s'il vous plait. 

Merci d'avance

Bonsoir,

J'ai également le même problème, peut-être qu'en comparant nos codes on pourrait trouver pourquoi ça ne fonctionne pas.

Dans mon code, c'est seulement quand j'écris un nombre inférieur à 0 et supérieur au nombre de pages du livre que ça ne m'écrit pas le console.log("Attention.....).

Ci-dessous mon Book.js :

class Book {
  constructor(title, author, pages, description, currentPage, read) {
    this.title = title;
    this.author = author;
    this.pages = pages;
    this.description = description;
    this.currentPage = currentPage;
    this.read = read;   
  }   
      readBook(number) {
        
      if (number <= 0 || number > this.pages) {
      console.log("Attention, saisie incorrecte.");
        
      } else if (number == this.currentPage) {
      console.log(number);
         
      } else if (number == this.pages) {
      this.read = true;
        
      } else {
      this.read = false;
      this.currentPage = number;
      }
}
}

Si tu trouves la solution fait moi signe également.

Merci

Salut 

je me suis cassé la téte a cherché a cherche j'ai reussit tout seul !!

- Dans la parentaise de ton constructor tu met "currentPage = 1" pour précisé la premiére pasge.

- Sur tes condition if est bien, 1er else if tu doit maitre si ton number est inférieur a this.pages ( tu continu en ! gros ! else if (tes conditions) { this.currentPage = number; }

- Les restes t'enléve et tu met else  { this.red = true }

Je sais pas si j'ai bien explquer, si non dsl !:  Redemende moi  

Salut,

J'ai réussi également. Mais je n'ai pas mis this.currentPage = currentPage. Mais ça fonctionne également ensuite.

Bonsoir.

@NellyDallo :

L'utilisation de la balise code facilite la lecture pour les autres, avec la coloration syntaxique.

- Dans ton constructor tu définis 6 arguments et quand tu appelles ta classe avec 'new' tu lui passes 5 arguments.

Au lieu d'imposer la valeur 1 à currentPage, il serait plus lisible de passer la valeur 1 quand tu appelles 'new'.

- Dans la méthode instance readBook on passe l'argument 'number' mais ensuite, dans tes tests tu n'utilises pas cet argument. 'number' est le nombre de pages lues, qui est passé grâce au bouton 'mettre à jour' de l'interface web. C'est cette valeur qu'il faut tester pour savoir où l'on en est dans le livre.

- 2 if suffisent. Si la page en cours n'est ni en dehors des limites, ni à l'intérieur, c'est qu'elle est sur la limite. Pas besoin de tester à nouveau, le deuxième else suffit.

- je pense que ton export est incorrect. Il n'y a pas de {}. Voici le mien pour comparer.

export const books = [livre1, livre2, livre3];

Après, je dis ça mais mon code ne fonctionne pas non plus. Chez moi le carrousel ne fonctionne pas mais je vois bien le premier livre. Quand le livre est lu, il descend bien dans la partie basse et le deuxième livre apparaît. Et quand mes trois livres sont lus, je n'ai pas le message d'alerte alors que tout le reste des conditions sont remplies.

Peut-être un problème externe à mon script.

Du coup j'ai pas la réponse au quiz. Je vais mettre au pif. Çà me prendra 6 jours max pour valider le tout...  

Enfin bon, si j'ai pu t'aider...

Ta fonction readBook ne renvoit rien dans ta seconde condition else if (page < this.pages). Elle devrait renvoyer 1.

Et il y a aussi un '0' qui suit ton ;

this.currentPage=page;0

Sinon pour moi aussi, problème de carrousel qui ne fonctionne pas, et rien n'apparaît dans Lu.

-
Edité par BenoîtPoux 1 juillet 2020 à 13:46:54

salut les gars pourriez vous envoyer votre corrigé si possible

Bonjour,

IL y a une chose qui m'échappe sur mon code , tous fonctionne nickel , mais l'alerte ne se met pas.

j'ai testé en désactivant les bloqueur de pub, sous Mozila, IE et Edge c'est la mème chose .

si quelqu'un peu m'aider , je laisse mon code en support

export class Book {
  constructor(title, author, description, pages, currentPage, read){
    this.title = title;
    this.author = author;
    this.description = description;
    this.pages = pages;
    this.currentPage = currentPage;
    this.read = read;
    } 
  readBook (number){
        if (number < 1 || number > this.pages){
          console.log('c\'est pas bon');
          return 0;
        }
        else if (number >= 1 && number < this.pages ){
            this.currentPage = number;
            return 1;
        }
        else if (number == this.pages){
          this.currentPage = number;
          this.read = true;
          return 1;
        }
    }
  }


  let livre1 = new Book ('chère mamie','Virginie Grimaldi','description1',231,1,false);
  let livre2 = new Book ('en voiture simone','Aurelie Valognes','description2',249,15,false);
  let livre3 = new Book ('l\'immeuble des femmes qui ont renoncé aux hommes','Karine Lambert','description3',213,45,false);

  export const books = [ livre1, livre2, livre3 ];

-
Edité par Fonkyjoy 1 octobre 2020 à 0:00:42

Fonkyjoy a écrit:

Bonjour,

IL y a une chose qui m'échappe sur mon code , tous fonctionne nickel , mais l'alerte ne se met pas.

j'ai testé en désactivant les bloqueur de pub, sous Mozila, IE et Edge c'est la mème chose .

si quelqu'un peu m'aider , je laisse mon code en support

export class Book {
  constructor(title, author, description, pages, currentPage, read){
    this.title = title;
    this.author = author;
    this.description = description;
    this.pages = pages;
    this.currentPage = currentPage;
    this.read = read;
    } 
  readBook (number){
        if (number < 1 || number > this.pages){
          console.log('c\'est pas bon');
          return 0;
        }
        else if (number >= 1 && number < this.pages ){
            this.currentPage = number;
            return 1;
        }
        else if (number == this.pages){
          this.currentPage = number;
          this.read = true;
          return 1;
        }
    }
  }


  let livre1 = new Book ('chère mamie','Virginie Grimaldi','description1',231,1,false);
  let livre2 = new Book ('en voiture simone','Aurelie Valognes','description2',249,15,false);
  let livre3 = new Book ('l\'immeuble des femmes qui ont renoncé aux hommes','Karine Lambert','description3',213,45,false);

  export const books = [ livre1, livre2, livre3 ];

-
Edité par Fonkyjoy 1 octobre 2020 à 0:00:42

Bonjour 

Il y a plusieurs erreurs dans ton code. Il faut enlever les "number".

il faut pas mettre console.log.

Bonjour,

J'ai modifié le code de Fonkyjoy et je ne comprends pas pourquoi il y a des erreurs au niveau des lignes 15, 19,

24, 25 puis de la ligne 28 à 32 quand je met le code dans le next.tech

Merci pour vos réponses (C'est bon j'ai trouvé)

export class Book {
  constructor(title, author, description, pages, currentPage, read){
    this.title = title;
    this.author = author;
    this.description = description;
    this.pages = pages;
    this.currentPage = currentPage;
    this.read = read;
    }
  readBook (page) {
        if (page < 1 || pages > this.pages){
          
          return 0;
        }
        else if (page >= 1 && < this.pages ) {
            this.currentPage = page;
            return 1;
        }
        else if (page === this.pages) {
          this.currentPage = page;
          this.read = true;
          return 1;
        }
    }
  }
 
 
  let livre1 = new Book ('chère mamie','Virginie Grimaldi','description1',231,1,false);
  let livre2 = new Book ('en voiture simone','Aurelie Valognes','description2',249,15,false);
  let livre3 = new Book ('l\'immeuble des femmes qui ont renoncé aux hommes','Karine Lambert','description3',213,45,false);
 
  export const books = [ livre1, livre2, livre3 ];

-
Edité par AurélienBergé1 26 novembre 2020 à 15:21:08

Bonsoir 

Le code est simple. C'est surtout l'interprétation qui est important

Prenez soin de vous

Bonjour, 

Pour info la construction de la fonction readBook, j'ai utilisé:

readBook = (page) => {

}

Ça fonctionne bien et pour voir apparaître le mot mystère, il faut biiiieeeeeennnnn suivre les instructions c'est mettre à jour UNE fois avec un numéro de page inférieur au nombre total puis mettre à jour avec le nombre total de page

Bonne journée et bon code à tous !

PS: perso j'ai trouvé le mot dans le code source héhé mais j'avais quand même besoin (pour mon égo :'D) de réussir le test.

Bonjour,

mes livres s'affichent dans le carrousel uniquement lorsque je supprime la méthode "readBook" autrement rien ne s'affiche nul part je ne comprends pas :

export class Book{
  constructor(title, author, description, pages, currentPage, read){
    this.title = title;
    this.author = author;
    this.description = description;
    this.pages = pages;
    this.currentPage = currentPage;
    this.read = read;
  }
  readBook(page){
    if (page < 1 || page > this.pages){
      return 0;
    }else if (page >= 1 && < this.pages){
      this.currentPage = page;
      return 1;
    }else if (page === this.pages){
      this.currentPage = page;
      this.read = true;
      return 1;
    }
  }
}

merci pour votre aide

Bonjour,

Ca à l'air d'etre un probleme recurrent visiblement, mais j'ai le même probleme, apres avoir recombiner tout les exemples de code, avoir chercher longtemps, et avoir constaté que ma fonction readBook fonctionnais bien ( car currentPage s'incrémente bien avec le nombre de page), mes livres ne ce classe pas dans "lu" , et je ne comprend pas pk...

(Ne vous moquez pas de mes noms de livre, j'aime bien me faire des kiff...)

J'ai tester sur plusieurs navigateur également, avec et sans les bloqueur de pub et autre.

export class Book {
  constructor(title, author,description,pages,currentPage,read){
    this.title = title;
    this.author = author;
    this.description = description;
    this.pages = pages;
    this.currentPage = currentPage;
    this.read = read;
  } // ici j'ai tester currentPage =1 , j'ai tester de sortir le "read" du constructeur également




  readBook=(page) =>{ // ici j'ai tester de faire sortir readBook de la class, c'est à ne pas faire, malgré que quelques personne l'ai conseillé. j'ai tester aussi sans passer par la fonction fléché, pas de changement, les deux fonctionnes
    // j'ai testé avec un switch, c'est pareil, ca fonctionne qu'a moitié (cad ca ne ce place pas dans "lu"
    if(page <1 || page > this.pages){
        return 0;
        }
    else if(page >= 1 && page < this.pages){
        this.currentPage += page;
        return 1;
        }
    else{ // j'ai tester avec un autre else if et (page === this.pages) , pas de changement non plus
        this.currentPage += pages; // j'ai tester sans le "+=" et seulement "=", mais cela ne s'incremente pas, j'ai trouver cela plus propre de le gardé incrementer
        this.read = true;
        return 1;       
       }
    
    }
  
  
}
const bookMartin = new Book ("martin", "Jean mich","serie B", 152,1,false);
const bookFifi = new Book ("fifi", " brindacier","ecoliere", 250,1,false);
const bookTata = new Book ("tata", "toto", "blague", 10,1,false);

export const books = [bookMartin,bookFifi,bookTata];

-
Edité par KatOlr 4 avril 2021 à 18:55:57

arf je n'y arrive pas, je n'ai rien sur ma page web :s

export class Book (title, author, description, pages, currentPage, read) {
  this.title = title;
  this.author = author;
  this.description = description;
  this.pages = pages;
  this.currentPage = currentPage;
  this.read = read;
  
 readBook(page){
   // argument page est inférieur à un ou supérieur au nombre total de pages du livre, readBook retourne 0
    if (page > this.pages || page < 0){
      return readBook = 0;
    }
    // l'argument page est supérieur ou égal à 1 et inférieur au nombre total de pages du livre, readBook modifie le champ currentPage de l'instance pour être égal à la valeur de l'argument passé, et retourne 1
    elseif (page>= 1 && page < this.pages){
      this.currentPage = page;
      return 1;
    }
    // 'argument page est égal au nombre total de pages du livre, readBook modifie le champ currentPage de l'instance pour être égal à la valeur de l'argument passé, modifie le champ read de l'instance en true, et retourne 1
    else (page === this.pages){
      this.currentPage = page;
      this.read = true;
      return  1;
    }
  }
}
let book1 = Book ("toto", "tata", "desc1", 200, 180, false);
let book2 = Book ("toitoi", "titi", "desc2", 200, 30, false);
let book3 = Book ("zozo", "tutu", "desc3", 200, 200, true);
let book4 = Book ("zozo", "tutu", "desc4", 200, 0, false);

export const books = [book1, book2, book3, book4];

si une ame charitable pouvait regarder ?

merci d'avance

Hello,

De mon coté au début les livres se mettaient bien dans la liste "Lus", mais je n'avais pas l'alert qui s'affichait dans le navigateur intégré (mon code était visiblement bon sans que je n'ai de mot qui apparaisse). Mais après avoir relus les instruction, je me suis rendu compte que je n'avais pas fait les mise à jour exactement comme c'était demandé (un click en trop sur le update suffit à ne pas faire apparaître le mot visiblement). Du coup maintenant c'est bon, j'ai le mot qui s'affiche. Comme l'avait dit @JohnDemory un peu plus haut il faut juste :

1) Pour un livre donné dans le carrousel, une fois qu'on à un numéro de page inférieur au nombre total total du livre, on appui UNE fois sur le bouton "update".

2) Puis, sans rafraichir le navigateur, on met dans le champs texte un nombre de page cette fois-ci égale au nombre total de page et on click de nouveau sur "update". Quand c'est fait le livre disparaît du carrousel pour se mettre dans la liste "lus" (si le code est bon).

C'est à faire sur chaque livres qui sont encore dans le carrousel (toujours sans rafraichir le navigateur), avec exactement le même processus . Et là normalement vous aurez le fameux mot mystère qui apparaîtra.

@ValerianPontus : Pour ton dernier "else" tu n'as pas besoin de mettre de condition normalement. Et lors de la création de tes objets tu as oublié le mot "new" devant Book (cela devrait être "new Book").

Voici le code que j'ai mis de mon coté (je ne me suis pas embêter pour les descriptions des livres) :

export class Book 
{
  constructor(title, author, description, pages, currentPage, read)
  {
    this.title = title;
    this.author = author;
    this.description = description;
    this.pages = pages;
    this.currentPage = currentPage;
    this.read = read;
  }

  readBook(page)
  {
    if (page <1 || page > this.pages)
    {
      return 0;
    }
    else if (page >= 1 && page < this.pages)
    {
      this.currentPage = page;
      return 1;
    }
    else
    {
      this.currentPage = page;
      this.read = true;
      return 1;
    }
  }
}

let tau = new Book("The Story of Tau", "Will Alexander", "blabla", 250, 100, false);
let romeoJuliette = new Book("Roméo et Juliette", "William Shakespaer", "blabla", 150, 20, false);
let quatreVingtQuatre = new Book("1984", "H.G Wells", "blabla", 300, 50, false);

export const books = [tau, romeoJuliette, quatreVingtQuatre];

En espérant avoir aider.

-
Edité par Aiole 14 juin 2021 à 23:13:04