IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
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 :

Héritage en JavaScript


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé Avatar de scandinave
    Homme Profil pro
    Développeur Java, NodeJs/Angular
    Inscrit en
    Mai 2009
    Messages
    277
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Java, NodeJs/Angular

    Informations forums :
    Inscription : Mai 2009
    Messages : 277
    Par défaut Héritage en JavaScript
    bonjour,
    j'ai un petit soucis avec l'héritage dans mes classe js. tout fonctionne nickel, création de classe, instantiation, héritage de méthode et attribut, a une exeption près.
    Admettons que je j'ai la méthode mère dans la classe Item qui fasse ceci:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    Item.prototype.mouseUp = function(e) {
          if( this.onDrag){
                 this.onDrag = false;
          }
    }
    Maintenant dans la classe fille Icon , si je ne redéfinit pas mouseUp, tout marche nickel.
    par contre si je fait ceci :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    Icon.prototype.mouseUp = function(e) {
          this.parent.mouseUp();
          somethingElse();
    }
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    Icon.prototype.parent = Icon.prototype;
    le this.onDrop fait reférence à l'attribut onDrop de la classe mere Item et non a celui de la classe fille Icon.

    Quelqu'un à une solution pour que cela fait référence à l'attribut de la classe fille?

    Si vous avez besoin de plus de code demandé moi.

  2. #2
    Expert confirmé
    Avatar de le_chomeur
    Profil pro
    Développeur informatique
    Inscrit en
    Février 2006
    Messages
    3 653
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : Février 2006
    Messages : 3 653
    Par défaut
    voici un petit exemple que j'ai adapté

    http://jsfiddle.net/WXjpd/

  3. #3
    Membre éclairé Avatar de scandinave
    Homme Profil pro
    Développeur Java, NodeJs/Angular
    Inscrit en
    Mai 2009
    Messages
    277
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Java, NodeJs/Angular

    Informations forums :
    Inscription : Mai 2009
    Messages : 277
    Par défaut
    merci pour ta réponse.
    J'arrivais déjà au résultat que ton code montre même si c'étais d'une manière différente.

    Par contre si je surcharge la méthodeA :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    // Classe mère 
    function classeMere() {
        this.name = 'Clase mère';
    	if ( typeof classeMere.initialized == "undefined" ) {
    		classeMere.prototype.methodeA = function() {
    			// code
                alert(this.name);
    		}
    		classeMere.initialized = true ;
    	}
    }
     
     
    function classeFilleExtendsMere() {
    	classeMere.call(this); // Cf Héritage par le constructeur de la classe mère
            this.name = 'Clase Fille';
    	if ( typeof classeFilleExtendsMere.initialized == "undefined" ) {
    		// Recopie des éléments au moyen d'une simple boucle
    		for (var element in classeMere.prototype ) {
    			classeFilleExtendsMere.prototype[element] = classeMere.prototype[element]
    		}
                    classeFilleExtendsMere.prototype.parent= classeMere.prototype;
    	        classeFilleExtendsMere.prototype.methodeA = function() {
    			this.parent.methodeA();
                            console.log('hello');
    		}	
    		// Ajout d'une nouvelle méthode
    		classeFilleExtendsMere.prototype.methodeB = function() {
    			// code
    		}	
     
    		classeFilleExtendsMere.initialized = true;
    	}
    }
    var newMere = new classeMere();
    newMere.methodeA();
     
    var newObjet = new classeFilleExtendsMere();
    newObjet.methodeA();
    j'obtiens dans l'ordre , "claseMere", "undefined" et "hello" au lieu de "claseMere", "claseMere" et "hello".

    Le problème viens peut être de mon
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    classeFilleExtendsMere.prototype.parent= classeMere.prototype;

  4. #4
    Rédacteur/Modérateur

    Avatar de SylvainPV
    Profil pro
    Inscrit en
    Novembre 2012
    Messages
    3 375
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Novembre 2012
    Messages : 3 375
    Par défaut
    Quand tu appelles :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    this.parent.methodeA();
    dans methodeA, this correspondra à this.parent et non this

    Ca marchera comme ça :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    this.parent.methodeA.call(this);

  5. #5
    Membre éclairé Avatar de scandinave
    Homme Profil pro
    Développeur Java, NodeJs/Angular
    Inscrit en
    Mai 2009
    Messages
    277
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Java, NodeJs/Angular

    Informations forums :
    Inscription : Mai 2009
    Messages : 277
    Par défaut
    Nickel , ça marche . Tu m'enlève une sérieuse épine du pied. merci

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Héritage en javascript
    Par Attrox dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 27/09/2014, 14h57
  2. Héritage en JavaScript ?!
    Par totof974 dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 25/08/2014, 18h23
  3. Balise OBJECT et héritage (css/javascript)
    Par Dionyzos dans le forum Balisage (X)HTML et validation W3C
    Réponses: 5
    Dernier message: 01/04/2007, 11h08
  4. Un pseudo héritage en javascript
    Par sekaijin dans le forum Général JavaScript
    Réponses: 8
    Dernier message: 05/07/2006, 11h31

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo