Discussion :

[Stopher]

Bonjour à tous,

Afin de produire un code le plus "propre" et "maintenable" possible, je tente de gérer mes librairies Js avec une encapsulation logique.

Seulement voilà, j'ai trouvé de nombreuses façons de faire sans savoir pour autant s'il est conseiller de suivre l'une ou l'autre ...

Pour le moment par exemple, je fait ça de façon trés simple, j'utilise une fonction pour encapsuler le tout et retourner uniquement un objet littérale contenant les méthodes et variables publiques.

Ex

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
 
function monobjet(){
 
//Méthodes et attributs privées 
var privfoo = null;
 
function privbar(){
  //...//
};
 
 
// Méthodes et variables publiques 
return {
 
   var publicvar = null,
 
   methodepub : function(){
      /.../
   };
 
  };
};

Puis j'utilie le code ci dessous comme ceci :

Code :

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

1
2
3
4
 
var objA = monobjet();
var objB = monobjet();
...

Seulement j'ai cru comprendre que cette façon de faire n'était pas optimum, car chaque création de "monobjet()" engendre la copie de l'enssemble des méthodes et variables en mémoire.

Le passage par prototype pour ajouter des méthodes après la déclaration initiale de l'objet ne semble pas le top non plus, car cela casse le coté privé / publique .


Comment faites-vous / organisez-vous votre code ?

pouvez-vous m'aider à retrouver mon chemin

Merci d'avance ,

Ch.

[Willpower]

Effectivement, les prototypes seront tous publiques puisque commun à tous les objets, maintenant a-t'on vraiment besoin de variables privées en javascript ?

Pareil pour l'optimisation, des fonctions redéclarées saturerons-t'elles la mémoire utilisée par ton navigateur ?

A moins que ton PC date de 1990 ou que ton codes fasses des millions de lignes de codes (ou du moins d'exécutions), je doute que l'optimisation soit réellement utile.

Après vouloir coder "correctement" est évidement important, mais ça dépendra fort de ton code et de son utilisation. Au cas par cas.


Si tu fais vraiment de l'orienté objet, je te conseilles de regarder les prototypes. (je ne vois pas vraiment de cas où tu as un intérêt de garder des variables "privées" en javascript.)

[Stopher]

Merci pour ta réponse,

Effectivement pour le coté client l’intérêt peut paraître mince, pour ce point, c'est plus pour avoir un code propre à la lecture/compréhension lorsque l'un de mes collègues ou moi même y remette les mains quelques temps plus tard.

Pour ce qui est de la mémoire, effectivement il y a de la marge, mais travaillant sur des interfaces destinées à des terminaux légers , gérés par une carte type : raspberry-pi , autant faire les choses du mieux possible ( sans chercher la petite bête évidemment ).

[SpaceFrog]

Les espaces de noms ne pourraient ils pas fournir une solution d'organisation ?

[p3ga5e]

Le passage par prototype pour ajouter des méthodes après la déclaration initiale de l'objet ne semble pas le top non plus, car cela casse le coté privé / publique .

Tu peux encapsuler tes membres privés dans une fonction closure lors de la déclaration de ton prototype

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
function monobjet() {};
monobjet.prototype = (function()
{	
	//functions et attributs privées
	var m_data = 0;
 
	function computedata()
	{
		m_data = 10;
	}
	//Methodes et proprietées public
	return {
		Factor : 6,
 
		GetData : function()
		{
			computedata();
			return m_data * this.Factor;
		}
	}
 
 
})();
 
var a = new monobjet();
alert(a.GetData());

[Stopher]

@p3ga5e
Mais pourquoi n'y avais-je pas pensé

Cette façon de faire me semble idéal pour mon cas .


Merci à tous pour vôtre aide .

Ch.

[Willpower]

Tu peux encapsuler tes membres privés dans une fonction closure lors de la déclaration de ton prototype

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
function monobjet() {};
monobjet.prototype = (function()
{	
	//functions et attributs privées
	var m_data = 0;
 
	function computedata()
	{
		m_data = 10;
	}
	//Methodes et proprietées public
	return {
		Factor : 6,
 
		GetData : function()
		{
			computedata();
			return m_data * this.Factor;
		}
	}
 
 
})();
 
var a = new monobjet();
alert(a.GetData());

Joli !

Petit rajout, (enfin ma remarque s'adresse au post initial, puisque tu as +/- repris ce code) pourquoi utiliser un objet littéral plutôt que le constructeur de la fonction elle même ?

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
function monobjet() {};
monobjet.prototype = new (function(){	
	// ----
	// Les méthodes/attributs (publics ou privés) ci-dessous seront communs à tous les objets de type "monobjet"
	// ----
 
	//functions et attributs privées
	var m_data = 0;
	function computedata()	{
		m_data = 10;
	}
 
	//Methodes et proprietées public
	this.Factor = 6;
	this.GetData = function(){
		computedata();
		return m_data * this.Factor;
	};
})();
 
var a = new monobjet();
alert(a.GetData());

Edit:

Je rajouterai même que avec ce code, les objets de type "monobjet" auront un attribut commun "Factor" mais factor étant un type primitif il n'existe pas de méthode pour le manipuler, donc le seul changement possible est une réassignation qui aura pour effet de créer une nouvelle valeur primitif pour l'objet en cours sans modifier l'attribut Factor des autres objets de type "monobjet".

[p3ga5e]

Je ne pense pas avoir réussi à suivre, totalement, ton raisonnement ...
Je n’ai pas noté de différence de comportement entre la déclaration du prototype par une closure qui retourne un objet JSON et une fonction constructeur anonyme !

Mais comme tu l’as indiqué cette méthode pose un problème : l’attribut m_data est statique a l’objet alors que la propriété Factor est diffèrent pour chacune des instances

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
function monobjet() {};
monobjet.prototype = (function()
{	
	//functions et attributs privées
	var m_data = 0;
 
	//Methodes et proprietées public
	return {
		Factor : 1,
		SetData : function(value)
		{
			m_data = value;
		},		
		GetData : function()
		{
			return m_data ;
		}
	}
 
})();
var a = new monobjet();
a.SetData(1);
a.Factor = 3;
var b = new monobjet();
b.SetData(3);
b.Factor =5;
 
alert(a.Factor);// affiche 3 :)
alert(a.GetData());// affiche 3 :(

Donc ,mea culpa , ma méthode n’est pas viable ! J’avais écrit ca sur l’idée du moment … sans jamais l’avoir utilisé moi-même. En tous cas cela semble confirmer que : la seule bonne pratique en JavaScript est de ne pas utiliser des closures pour tenter de reproduire une encapsulation de membres privés.

Seulement j'ai cru comprendre que cette façon de faire n'était pas optimum, car chaque création de "monobjet()" engendre la copie de l'enssemble des méthodes et variables en mémoire.

Logiquement ca devrait être le cas ! Mais dans la pratique cela ne semble pas aussi évident !

[Stopher]

Conclusion autant rester avec l'encapsulation par fonction constructeur, et si besoin ajouter des variables partagées en passant par prototype.

En tout cas cette discussion qui m'a poussé à faire quelques recherches, aura eu le mérite de m'éclairer sur les piles d’exécution en javascript, et son chaînage des prototypes.

Lien intéressant trouvé suite à cette discussion :
voyage-au-coeur-de-javascript

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
 
function monobjet() {
 
            //functions et attributs privées
            var m_data = 0;
 
            //Methodes et proprietées public
            return {
                Factor : 1,
                SetData : function(value)
                {
                    m_data = value;
                },
                GetData : function()
                {
                    return m_data ;
                }
            }
 
        };
 
        var a = new monobjet();
        a.SetData(1);
        a.Factor = 3;
        var b = new monobjet();
        b.SetData(3);
        b.Factor =5;
 
        alert(a.Factor);// affiche 3 :)
        alert(a.GetData());// affiche 1 :)

[Willpower]

Voila, le prototype c'est juste pour définir des méthodes et attributs par défaut communs à tous tes objets.

Donc en général, pour les méthodes de base c'est utile pour ne pas dupliquer le code en mémoire.

Les variables (privées) communes à tous les objets peuvent être écrite dans la déclaration du prototype comme l'a montré p3ga5e (ainsi que les getter et setters associés) et les variables (privées) propres à chaque objet doivent être déclaré dans le "constructeur" (ainsi que les getters et setters associés).

@p3ga5e: ça dépend ce que tu veux faire, si tu veux avoir une variable primitive (string, boolean et number) partagée entre tous les objets, il te suffit de l'inclure dans une variable (publique) de type "object" dans le prototype :

comme ceci :

Code :

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

monobjet.prototype.shared_data = {factor:6};

au lieu de :

Code :

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

monobjet.prototype.factor = 6;

@Stopher: Dans ton code :

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
function monobjet() {
 
            //functions et attributs privées
            var m_data = 0;
 
            //Methodes et proprietées public
            return {
                Factor : 1,
                SetData : function(value)
                {
                    m_data = value;
                },
                GetData : function()
                {
                    return m_data ;
                }
            }
 
        };
 
        var a = new monobjet();
        a.SetData(1);
        a.Factor = 3;
        var b = new monobjet();
        b.SetData(3);
        b.Factor =5;
 
        alert(a.Factor);// affiche 3 :)
        alert(a.GetData());// affiche 1 :)

Les "new" sont inutile puisque tu retourne un objet différent du "this", donc l'objet retourné n'est pas de type "monobjet" et ne possèdera pas ses prototypes, c'est pour quoi pour faire de l'orienté objet, tu ne dois pas retourner un nouvel objet (mais laisser le this être renvoyé par défaut) :

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
function monobjet() {
 
            //functions et attributs privées
            var m_data = 0;
 
            //Methodes et proprietées public
            this.Factor = 1;
            this.SetData = function(value)
                {
                    m_data = value;
                };
            this.GetData = function()
                {
                    return m_data ;
                }
            };
            // return this; // par défaut donc pas besoin
        };

Ce que tu faisais, c'était un simple appel de fonction qui servait de closure à la variable "m_data" et qui renvoyait un object_object(standard) contenant des méthodes ayant accès à ta variable "m_data". Rien de plus, l'objet retourné n'était pas de type "monobjet".

Tu peux t'amuser à vérifier et faire des tests avec l'opérateur "instanceof" comme ceci :

Code :

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

1
2
a = new monobjet();
alert(a instanceof monobjet);