Les classes en JS

Question

Bonjour,

Voilà, j'ai enfin réussi à faire ma première classe en javascript!
Mais il y a un "hic" (évidement...)

Je m'explique, lorsque que je fais une instance de ma classe il n'y a pas de problème. Mais impossible de créer plusieurs instances de cette classe?

En cherchant sur internet j'ai vite compris que mon objet était copié par référence et non par valeur... J'ai également trouvé divers solutions pour résoudre le problème mais j'aimerais savoir si quelqu'un à de l'expérience dans le domaine pour m'aider à trouver la meilleur solution.

Pour information j'ai utilisé la librairie "prototype" pour créer ma classe croyant (bêtement) que le problème ne se poserait pas.

Merci d'avance

Arto_8000 · Answer

Il faut regarder d'avantage au niveau du clonage d'objet. Ce qui a l'air d'être la méthode la plus simple pour faire cela en javascript est ceci :

function clone(obj){
    if(obj == null || typeof(obj) != 'object')
        return obj;
    var temp = new obj.constructor(); 
    for(var key in obj)
        temp[key] = clone(obj[key]);
    return temp;
}

Sources :
http://dev.petitchevalroux.net/javascript/cloner-objet-avec-fonction-clone-javascript.115.html
http://keithdevens.com/weblog/archive/2007/Jun/07/javascript.clone

alexflex25 · Answer

Bonsoir,

Très bonne idée, mais mon objet semble trop gros puisque le javascript me retourne 
"too much recursion"

L'idée reste tout de même très bonne.

Peut-être une autre piste?

Merci beaucoup

alexflex25 · Answer

Re bonsoir,

Apres le "profilage" (cf: firebug) la fonction "clone" que tu m'as fournis est appelé 485552 fois pour cloner mon objet.

Pourtant je n'ai que 30 attributs et 21 méthodes...

Arto_8000 · Answer

La problème que tu as dans ton cas, c'est que tu as probablement des objets qui sont placés sur le prototype de la classe Object.

Ceci créera un objet avec une profondeur infini :

Object.prototype.obj = {valeur : "obj"};
{test : "1"}.obj.obj.obj.obj.obj.obj.valeur == "obj"

Il y a deux façons de résoudre le problème, soit que tu limites la profondeur de la copie ou que tu ne copie pas ce qui est hérité de Object.

Solution 1 (profondeur maximal):

function clone(obj, maxDepth) {
if(obj == null || typeof(obj) != 'object')
        return obj;
    var temp = new obj.constructor(); 
    for(var key in obj) {
        if (maxDepth > 1)
    temp[key] = clone(obj[key], maxDepth - 1);
        else
    temp[key] = obj[key];
    }
    return temp;
}

Solution 2 (omission du prototype de la classe Object) :

function clone(obj){
    if(obj == null || typeof(obj) != 'object')
        return obj;
    var objPrototype = Object.prototype;
    var temp = new obj.constructor(); 
    for(var key in obj) {
if (!objPrototype[key])
    temp[key] = clone(obj[key]);
    }
    return temp;
}

alexflex25 · Answer

Bonsoir et merci,

J'ai testé aujourd'hui les deux fonctions:
L'utilisation de la fonction numéro deux me retourne:

uncaught exception: [Exception... "Cannot convert WrappedNative to function" nsresult: "0x8057000d (NS_ERROR_XPC_CANT_CONVERT_WN_TO_FUN)" location: "JS frame :: (site web) :: clone :: line 68" data: no]

Je ne vous cache pas que ce message dépasse de très loin mes (maigres) compétences en javascript...


Pour ce qui est de la 1ere fonction je vois très bien ou est l'astuce, mais comment définir la profondeur de son objet?
J'imagine que chaque attribut correspond au premier niveau, mais les méthodes...

Bref je pense avoir beaucoup trop de lacune pour comprendre réellement ces fonctions.

Je vais faire des recherches pour mieux comprendre, dans tous les cas merci pour tes explications

alexflex25 · Answer

Re bonsoir,

J'ai trouvé une solution (certes nul), mais qui m'a montré un autre problème stupide...
Je ne sais pas si j'ose vous parler de ma solution mais je me lance quand même... (tant pis pour les moqueries)

J'ai fais une "class" que j'ai nommé "Maclasse" que j'ai dupliqué pour faire "MaclasseA" et "MaclasseB" qui sont strictement identique...
J'ai donc deux fichiers identiques "MaclasseA" et "MaclasseB" où j'ai simplement changé le nom de la class

quand je fais:
var a = new MaclasseA();
var b = new MaclasseB();

Pas de problème a et b sont bien deux objets identiques et indépendant (ouf...)

Mais le problème, c'est que dans "Maclasse" je défini des actions sur les attributs  sur l'événement "document.onclick".
Donc forcement mes actions sont toujours écrasés par la dernière instance de "Maclasse" que se soit "MaclasseA" ou "MaclasseB"

En résumé... je pense... que je l'ai dans le ..........(coude évidemment)

Peut être y a t'il une solution?

Merci beaucoup

Arto_8000 · Answer

Pour ce qui est de la profondeur, tu peux voir ça comme le nombre de «.» que tu mets pour atteindre ce que tu veux.

Ainsi,

var obj = new Object();
obj.value // profondeur 1
obj.objDansOjb.valeur // profondeur 2

Pour l'autre méthode essaie avec ceci, j'ai testé de mon côté la version original et il n'y avait pas de bogue, mais j'ai une petite idée de ce qui a pu causer le problème.

function clone(obj){
    if(obj == null || typeof(obj) != 'object')
        return obj;
    var objPrototype = Object.prototype;
    var temp = new obj.constructor(); 
    for(var key in obj) {
if (typeof objPrototype[key] == "undefined")
    temp[key] = clone(obj[key]);
    }
    return temp;
}

Les classes en JS

7 réponses

Votre réponse

Discussions similaires