Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Closures, Class et inputs (variable dynamique)


Sujet :

JavaScript

  1. #1
    Candidat au Club
    Closures, Class et inputs (variable dynamique)
    Bonjour à tous,

    Je suis débutant en programmation, j'ai besoin d'un coup de pouce, malheureusement après de nombreuses de recherches, je ne trouve pas de réponses à ma question ou de piste à creuser.
    Je pense ne pas avoir la bonne méthode ou alors ne pas avoir compris l'utilité des classes. Peut-être que je me complique trop la vie.

    Mon projet d'apprentissage c'est de :

    -> créer des utilisateurs par le biais de un ou de deux input text (nom et prénom) puis de les afficher et aussi d'ajouter un compteur score et un bouton d'incrémentation individuel à coté de leur nom.

    J'ai penser à crée une classe comme ceci

    Code :Sélectionner tout -Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    class personne {
      constructor(nom, prenom,score){
        this.nom = nom,
        this.prenom = prenom
        this.score = score
        this.compteur = () => { fonction qui incrémente this.score}
     }
    }


    Pour le moment je n'est pas utiliser la création d'utilisateur par les inputs mais directement dans le fichier js
    Je peux donc pouvoir crée de nombreux objets avec cette classe exemple :

    Code :Sélectionner tout -Visualiser dans une fenêtre à part
    1
    2
    const john = new personne("john", "doe",0)
    const lucky = new personne("lucky", "luc",0)


    Tout marche super bien, j'arrive a afficher, et incrémenter les scores (même à les sauvegarder en localstorage) à partir du moment ou c'est moi même qui créer en dur.

    Maintenant imaginons qu'un utilisateur inscrit son nom et son prénom dans des inputs avec un bouton et un événement click lié a celui-ci, qui vas forcement lancer une fonction.
    Comment puis-je créer dynamiquement d'autre objet avec ces données que je ne maîtrise pas ? J'aurai imaginer faire une variable par utilisateurs et c'est peut-etre mon erreur?

    J'ai pensé a un tableau avec une boucle, mais cela ne résous pas mon problème de création de variables exemple :

    [CODE]const liste= ["jean", "marc", "sophie","marie"]

    for (let i = 0; i<liste.length; i++){
    let liste[i] = 0 //Uncaught SyntaxError: Unexpected token '[' <-- vilaine erreur }[/CODE]

    A mon avis, je m'y prends mal.

    merci d'avance !!!! ça serait super de me débloquer.

  2. #2
    Rédacteur/Modérateur

    Tout dépend de ce que tu comptes faire de ces données par la suite …
    devront elles survivre à la page ?

    si non , regarde du coté de push() dans un array
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

    réalisations :www.oxygen-translations.fr|www.saftair.fr| www.ouestisol.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr
    Humour

  3. #3
    Candidat au Club
    Merci de ta réponse Spacefrog.

    Je n'ai rien as en faire, juste à afficher les prénoms des participants et a les sauvegarder en localstorage dans le meilleur des cas.

    Pour une liste de prenoms à afficher, j'aurais du surement utiliser un array simple avec une boucle pour les afficher plutôt que de créer autant de variable que de prénom existant.(let prenom = new user)

    Je peux rentrer le data d'un input texte dans un array avec push mais apparament je ne peux pas creer des variables directement à la volé. (exemple input.value="Jean" ------> fonction qui crée Let jean = new user)

    Ce qui ma enduit en erreur c'est que j'ai voulu ajouter un compteur propre à chaque prénom, du coup j'en ai fais un méthode de la Class, cela fonctionne mais seulement si je creer des utilisateurs à la main dans le code, mais pas depuis un input.
    Bref...les formations...les videos...c'est bien..mais quand on passe a la pratique...c'est une autre histoire.!

  4. #4
    Rédacteur/Modérateur

    un array de users … push un objet personne dans ton array
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

    réalisations :www.oxygen-translations.fr|www.saftair.fr| www.ouestisol.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr
    Humour

###raw>template_hook.ano_emploi###