Instancier un singleton

Version imprimable

bonjour, j'ai construit le singleton suivant :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var Dashboard = (function(){
      var constructeur = function(){
            var canvas = document.getElementById('dashboard');
            var ctx = canvas.getContext('2d');
            // others attributs and methods
      }
 
      var instance = null; 
      return new function(){
           this.getInstance = function(){
                 if( instance == null){
                        instance = new constructeur();
                 }
                 return instance;
           }
     }
 
})();

lors que j'appelle le singleton comme ceci :

Code:

1
2
3
$(document).ready(function(){
     var  dash = Dashboard.getIntance();
});

je récupère bien l'instance. Par contre si je l'appelle ensuite comme ceci:

Code:

1
2
3
4
function Item(x, y, width, height) {
       this.dashboard = Dashboard.getIntance();
       // others attributs and methods
}

j'obtient l'erreur suivante :

Citation:

canvas is null
var ctx = canvas.getContext('2d');

quelqu'un a une idée sur ce problème?

04/02/2013, 13h10
SpaceFrog

soit tu ne nous montres pas tout le code ...
soit il y un souci de parenthèse en trop

Code:

var Dashboard = (function(){
04/02/2013, 13h44
scandinave

dsl , un oublie de ma part sur le post , c'est corrigé ci dessus. manquait

Citation:

)();

à la fin
04/02/2013, 13h50
SpaceFrog

ce qui est donc la cause du problème ...

Code:

)();

là, la fonction est exécutée
et je suis prêt a parier que c'est directement au chargement de la page et pas dans le ready ...
=> ta page n'a pas fini de charger et ton canvas n'est pas instancié .
var canvas = document.getElementById('dashboard'); => paf !!!! erreur
04/02/2013, 14h06
scandinave
donc tu me dis que le premier cas marche, parce que j'ai un
Code:

1 2 3 $(document).ready(function(){ }
pourtant l'item est bien instancié dans le document.ready également :
Code:

1 2 3 4 $(document).ready(function(){ var dash = Dashboard.getIntance(); var text = new Text("mon message", 1, 50); });
l'object Text hérite de Item. Donc je ne voit pas pouquoi le premier appel marche bien mais que le 2nd dans l'object Text ne marche pas.
04/02/2013, 14h15
SpaceFrog

je ne parle pas ce l'instanciation, je parle de la declaration ...

Code:

var Dashboard = (function(){ ... })()

ça tu l'a mis ou dans ton code ...

si il n'est pas dans le ready, et qu'il est dans le head de ta page, c'est a dire dans le flux AVANT ta balise canvas ...
vu que la focntion est exécutée avec les () finales, à ce moment là ton canvas n'existe pas encore ...

A passage, ce n'est pas la cause de ton souci, mais tant qu'a prendre de bonnes habitudes de codage, il y a une nouvelle entrée dans les contributions qui peut t'intéresser : http://www.developpez.net/forums/d13...n/#post7107219

ahh oui, effectivement, c'est tout à fait ça. Comment je peux résoudre ce problème?

J'ai essayer de placer çà

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
$(document).ready(function(){
     var Dashboard = (function(){
         var constructeur = function(){
            var canvas = document.getElementById('dashboard');
            var ctx = canvas.getContext('2d');
            // others attributs and methods
         }
 
         var instance = null; 
         return new function(){
             this.getInstance = function(){
                 if( instance == null){
                        instance = new constructeur();
                 }
                 return instance;
             }
         }
 
     };
});

Mais sans succès :)

En gros avant, j'avais la même classe mais non construite sous forme de singleton. Tout marchais correctement. seulement j'ai maintenant besoin du singleton.

04/02/2013, 14h27
SpaceFrog

ne lance par la fonction au départ ?
=> enlève les () à la fin
04/02/2013, 14h30
scandinave

Ok mais le singleton marche toujours dans ce cas? je suis pas encore trop au point niveau design pattern javascript.

J'ai trouvé une solution qui marche en déclarant les fichiers .js en fin de page html. Comme ça le canva est déjà déclarée. Je sais pas si c'est une bonne idée.
04/02/2013, 14h51
Bovino

La notion de singleton n'existe pas en JavaScript...
D'autre part, si Dashboard() renvoie une valeur, ce n'est plus un constructeur...