Discussion :

[Sharcoux]

Bonjour,

J'ai un problème pour charger un objet en javascript. Ma démarche n'est probablement pas du tout la bonne à cause de mes réflexes de langages de classes.

J'ai une "classe" Document :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
Document = function() {... attributs ...}
Document.prototype = {... methodes ...}

voici les méthodes que j'utilise pour les sauvegarde/chargement :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
setCurrentDocument = function(document) {localStorage.setItem("currentDocument",JSON.stringify(document));}
getCurrentDocument = function() {return JSON.parse(localStorage.getItem("currentDocument")));}

mais l'objet ainsi sauvegardé/chargé perd les méthodes propres à sa "classe" Document (celles déclarées dans Document.prototype).
Du coup, est-ce qu'il faut déclarer les méthodes autrement, de façon à ce qu'il les conserve? Ou bien est-ce que je dois écrire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

getCurrentDocument = function() {return new Document(JSON.parse(...));}

Dans ce cas, j'en viens à une deuxième question qui va vous paraitre stupide :
j'ai besoin de déclarer deux constructeurs :
Document = function() {...},
et aussi Document = function(doc) {...} afin de charger mon document comme décrit précédemment.
Mon problème, c'est comment faire ça en javscript ?

Encore une fois, je suis conscient que ma logique n'est pas la bonne. N'hésitez pas à m'ouvrir l'esprit

[sylvain230]

Bonjour,

Pourquoi n'essaies tu pas de charger tes objets avec jQuery ?
C'est plus simple il me semble.

Exemple d'un code à moi :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
WebGLBuffer.prototype.bufferTeapot = function() {
 
 
$.getJSON("Objets/Teapot.json",function(teapotData)
    {
...
     });
 
}

Voila

[Sharcoux]

Merci, mais $.getJSON demande une url sauf erreur. Alors pour accéder au localStorage du navigateur, je sais pas trop quoi mettre...

Mais peut-être que JQuery peut effectivement apporter une réponse plus simple à ma question.

[sylvain230]

Sinon tu peux toujours créer un serveur en local et cela marchera normalement.

[Sharcoux]

oO ?!
Tu veux que je crée un server local côté client en javascript juste pour pouvoir utiliser .$getJSON au lieu de JSON.parse(localStorage.getItem(...)) ?
C'est pas un peu tordu comme solution ?

Ou alors j'ai pas du tout compris ce que tu voulais dire par "créer un serveur en local"

[sylvain230]

Ben oui c'est un peu tordu comme solution j'avoue lol mais cela fonctionne normalement.
Avec FF sur mais avec Chrome je sais plus :s

[Bovino]

Pourquoi n'essaies tu pas de charger tes objets avec jQuery ?

Parce que jQuery n'est pas du tout adapté à cette situation
Et utiliser jQuery (ou tout autre framework) comme rustine aux lacunes que l'on a en JavaScript est rarement la bonne utilisation

@Sharcoux : il faudrait que tu nous montres plus de code : comment sont créées tes méthodes et tes propriétés et comment tu les appelles. Ceci dit, appeler un paramètre document est suicidaire, comment veux-tu que JavaScript distingue ton paramètre de l'objet window.document (puisque window est implicite) ?

[Sharcoux]

appeler un paramètre document est suicidaire, comment veux-tu que JavaScript distingue ton paramètre de l'objet window.document (puisque window est implicite) ?

euh... chépa ^^ En tout cas pour le moment il y arrive
Bon d'accord, en fait il s'appelait doc, et j'ai dû le renommer à cause de conventions de nommage. Mais maintenant que tu le dis, document était peut-être pas l'idée la plus géniale que je puisse trouver pour le nouveau nom

Bon, par contre, pour mon problème, voilà la classe document :

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
/* JSON document */
var JSONDocument = function() {
    this.type = "text";
    this.author=getCurrentUser().getName();
    this.title="Untitled";
    this.content="";
    this.creation=currentTime();
    this.lastModification=currentTime();
    this.state=Document.states.draft;
 
    this.setAsCurrentDocument();//temp
}
JSONDocument.prototype = {
    //type
    getType: function() {return this.type;},
 
    //content
    getContent:function() {return this.content;},
    setContent:function(content) {this.content=content;},
 
    //title
    getTitle:function() {return this.title;},
    setTitle:function(title) {this.title=title;},
 
    //author
    getAuthor:function() {return this.author;},
    setAuthor:function(userName) {this.author=userName;},
 
    //dates
    getCreation:function() {return this.creation;},
    getLastModification:function() {return this.lastModification;},
    setLastModification:function(date) {this.lastModification=date;},
 
    //state
    getState:function() {return this.state;},
    setState:function(state) {this.state=state;},

Je suis sûr qu'il y a un moyen pour "raccrocher" le prototype de JSONDocument à l'objet que je charge depuis le storage, mais je sais pas comment faire

[p3ga5e]

Attention a la manière dont tu prototype tes objets. Normalement la propriété prototype permet d’ajouter des méthodes ou attributs aux instances déjà créer de l’objet.

par exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
var JSONDocument = function() { this.title = "Document A" }
 
var doc = new JSONDocument(); 
 
JSONDocument.prototype.DisplayTitle = function() { alert(this.title); };
 
doc.DisplayTitle();

or ceci, chez moi sous Firefox, ne marche pas :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
var JSONDocument = function() { this.title = "Document A" }
 
var doc = new JSONDocument(); 
 
JSONDocument.prototype = 
{
	DisplayTitle : function() { alert(this.title); }
}
 
doc.DisplayTitle(); // erreur DisplayTitle == undefined

Pour tes problèmes initiaux je te répondrais plus tard la c’est la pause dej !

[Sharcoux]

Hum... Je suis pas convaincu :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
var Document = function() { this.title = "Document A";}
Document.prototype =
{
	DisplayTitle : function() { alert(this.title); }
}
 
var doc = new Document();
doc.DisplayTitle();

marche très bien chez moi.

[Bovino]

Attention a la manière dont tu prototype tes objets. Normalement la propriété prototype permet d’ajouter des méthodes ou attributs aux instances déjà créer de l’objet.

Heu... non pas vraiment. J'aurais même tendance à dire au contraire, il est préférable de déclarer complètement l'objet (donc en incluant les ajouts au prototype) avant d'instancier un objet, même de toute façon, l'ajout au prototype impacte toutes les instances, qu'elles existent déjà ou non.