Besoin d'aide JS OO

Hello,

J'aimerai créer une librarie graphique pour créer un barchart ( je sais qu'il en existe déjà des tas mais ceci est juste dans un but d'apprentissage ).
J'ai d'en l'idée de créer un objet style jquery ex : monobj("divtoto").createGraph(200,300); j'ai tenté de m'appuyer sur le code jquery pour le faire, mais je n'y arrive pas.

Voici le début de mon code.

Code:

---

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 40 41 42 43

(function(window){ var _version= "0.0.1", _canvas; AnimatedGraph = function (className){ return new AnimatedGraph.fn.init(className); };   AnimatedGraph.fn = AnimatedGraph.prototype = { constructor: AnimatedGraph, init: function(className){ _canvas = AnimatedGraph.search(className); _canvas.innerHTML = "Youpi"; }, search: function(className){ var elm = document.getElementsByTagName("div"); for(i=0;i<elm.length;i++){ if(elm[i].className == className) return elm[i]; } }, createGraph: function(width,height){ var title = document.createElement("div"); title.innerHTML="tutu"; _canvas.appendChild(title); } };   return (function(){ var ret = new AnimatedGraph(); ret.createGraph = createGraph; return ret; });     AnimatedGraph.search = AnimatedGraph.fn.search; function createGraph(width,height){ var title = document.createElement("div"); title.innerHTML="tutu"; _canvas.appendChild(title); };   window.Graph = AnimatedGraph; })(window);

---

Mais si j'exécute Graph('canvas').createGraph(200,300) cela ne marche pas quelqu'un pourrait-il m'aider ?

D'avance merci

Bonjour

Si vous voulez créer une librairie graphique avec un fonctionnement "à la jQuery", je vous conseille de lire les quatre tutoriels de Teylor Feliz : Comment créer facilement un framework JavaScript.

Hello Daniel,

Ah merci beaucoup super, j'avais pas vu ce tutoriel.

Il va bien me servir pour comprendre certaines notions encore un peu abstraite pour moi :mrgreen: :

Bonne journée

Alors après avoir lu rapidement, je n'ai pas trouvé l'information dont j'avais besoin.

En effet j'aimerai faire comme : $('#divid').methode(param) pour faire quelque chose. Avec le code de mon premier message j'arrive bien à avoir un objet du type $('#divid') ex : Graph('canvas') par contre si j'appelle la méthode search qui est sensé appartenir à mon objet soit directement par graph('canvas').search soit par obj = graph('canvas') et obj.search j'ai systématiquement une erreur me disant que la méthode search n'hésiste pas. Ou est-ce que je me suis trompé ?

d'avance merci

Citation:

---

// cette innocente fonction devient un constructeur
var myClass = function (message) {
this.publicVariable = 10;
alert(message);
return new mySubClass.increment();
};

// accès au prototype
mySubClass = myClass.prototype = {
constructor: myClass,
decrement:function() {
console.log( --this.publicVariable );
},
increment:function() {
console.log( ++this.publicVariable );
}
};

myObject = new myClass();
myObject.decrement(); // -1
myObject.decrement(); // -2
mySubClass.increment(); // 1

---

Je ne comprends pas pourquoi sur ce code qui est quasiment comme celui trouver sur un tutoriel, j'obtiens une erreur sur myObject.decrement(); on ca me dit que decrement n'est pas une fonction .:calim2:

Code:

---

return new mySubClass.increment();

---

C'est quoi ce retour du constructeur ?!

Je suis assez débile alors j'utilise toujours le même système pour faire du OO.

Code:

---

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

function MyClass(){} //objet MyClass.prototype = { myMethode1:function(i,j){ //publicMethode return true; }, myMethode2:function(i,j){ //publicMethode if this.myMethode1{i,j} return false; }, initialize: function(els) { this.elements = (els.elements || els).slice(); this.publicPropriete1=this.elements[0];//publicPropriete this.publicPropriete2=this.elements[1];//publicPropriete this.publicPropriete3=1;//publicPropriete return this; } };   //constructeur MyClass.create = function(elements) { var M = new MyClass(); return M.initialize(elements); };   //autre constructeur MyClass.zero = MyClass.create([0,0]);   //autre constructeur MyClass.swap = function(el0,el1) { return MyClass.create([el1,el0]); };   //library style var $M = MyClass.create;

---

C'est lisible et flexible, avec une bonne structure bien solide.
J'ai repompé ça sur http://sylvester.jcoglan.com/

jquery après j'y connais pas grand chose, mais j'espère que ça t'aidera à déméler comment marche le OO en javascript.