logo oujood
🔍

🛒 Classe Produit – Panier E-commerce

Dans ce chapitre, nous commençons à bâtir notre application de panier e-commerce. Le premier élément clé est le produit. Nous allons créer une classe TypeScript qui représente un produit avec ses propriétés et son comportement.

OUJOOD.COM

📦 Que doit contenir un produit ?

Chaque produit doit avoir au minimum :

  • un identifiant unique (id)
  • un nom
  • un prix
  • une quantité en stock
  • une description (optionnelle)

🧱 Déclaration de la classe `Produit`

📋 Copier le code

class Produit {
  constructor(
    public id: number,
    public nom: string,
    public prix: number,
    public stock: number,
    public description?: string
  ) {}

  afficherInfos(): string {
    return \`\${this.nom} - \${this.prix} € (\${this.stock} en stock)\`;
  }
}

🧠 Explication ligne par ligne

  • constructor(...) initialise automatiquement les propriétés
  • description? signifie que cette propriété est optionnelle
  • afficherInfos() est une méthode simple pour afficher un résumé du produit

✅ Exemple d’utilisation

📋 Copier le code

const clavier = new Produit(1, "Clavier mécanique", 79.99, 10, "Clavier RGB très réactif");
console.log(clavier.afficherInfos());
  • On crée une instance de Produit avec des valeurs réelles
  • La méthode afficherInfos() retourne une chaîne lisible

📌 Résumé

  • La classe Produit encapsule toutes les informations nécessaires à un article
  • Elle contient une méthode d'affichage simple
  • Ce sera l’unité de base utilisée dans le panier

🧭 Prochaine étape

Dans le prochain chapitre, nous allons créer la classe Panier, qui permettra d’ajouter, retirer et afficher des produits, ainsi que de gérer les quantités à l’aide des boutons ➕ ➖ .

Souhaites-tu passer au Chapitre 2 du Module 3 : Création de la classe Panier ?