Discussion :

[xess91]

Bonjour � tous,

Je souhaiterai avoir des informations sur la forme d'�criture suivante:

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
 
(function(){
 
	myobject.create('myobject.util.Dispatcher', {
		scope : null,
		listeners : null,
 
		Dispatcher : function(s) {
 
		}
	});
 
	(function(myobject) {
		myobject.create({
			DropMenu : function(id, s) {
 
 
	}});})(myobject);
 
}());

J'ai remarqu� que Jquery et TinyMce �taient �crit de cette mani�re.
Comment s'appelle cette m�thode? c'est JSON? Pouvez-vous me communiquer des tutos sur cette m�thode de cr�ation d'objet? Je connaissez le prototypage, mais l� j'avoue me poser la question sur cette m�thodologie.

Merci � tous pour vos r�ponses.

[Willpower]

Si tu parles de la closure, �a sert � travailler sur des variables locales et donc � restreindre leurs port�es. (ne pas modifier des variables existantes et ne pas se faire modifier nos variables par d'autres morceaux de code).

exemple :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
var a = 1;
function init(){
    var a = 2;
    function getA(){
        return a;
    }
    return getA;
}
var getA = init();
alert(a); // 1
alert(getA() ); // 2
alert(a); // 1

donc en gros, c'est ce qu'ils font sauf que �a ne sert � rien de nommer une fonction dans le seul et unique but de l'appeler une et unique fois juste apr�s, autant d�clarer et ex�cuter une fonction anonyme directement.

donc au lieu de :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
function init(){
    alert('init');
}init();

on fait

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
(function(){
    alert('init');
})();

l'utilisation de fonction anonyme peut aussi servir � conserver l'�tat d'une variable :

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
var arr = new Array(10);
for(var i=1;i<10;i++){
    arr[i] = function(){alert(i);};
}
arr[5](); // affichera 9 car i vaudra 9 à la fin de la boucle
 
// il faut donc faire :
var arr = new Array(10);
function createFn(a){ // j'ai appelé la variable a pour éviter toutes confusions, mais on peut très bien l'appeler i car ce sera un i local donc différent de celui reçu en paramètre
  return function(){alert(a);};
}
for(var i=1;i<10;i++){
    arr[i] = createFn(i);
}
arr[5](); // affichera bien 5
 
 
// on peut utiliser la fonction anonyme :
var arr = new Array(10);
for(var i=1;i<10;i++){
    arr[i] = (function(a){ return function(){alert(a);};  })(i);
}
arr[5](); // affichera bien 5

[Willpower]

si tu parlais du fait de passer un objet litt�ral dans une fonction :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

maFonction({name:'developpez'});

bah c'est un raccourci pour :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
var obj = new Object();
obj.name = 'developpez';
maFonction(obj);

mais je pense que ta question, bien que vague, concernait plut�t les closures(anonymes).

[xess91]

Merci pour tes r�ponses qui m'apportent d�j� quelques r�ponses.

En fait je parlais plus g�n�ralement de la m�thode de d�veloppement utilis� par TinyMce et Jquery.

Par exemple si on prend le fichier d'entr�e de TinyMce, il est comme �a:

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
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
 
(function() {
	var i, nl = document.getElementsByTagName('script'), base, src, p, li, query = '', it, scripts = [];
 
	if (window.tinyMCEPreInit) {
		base = tinyMCEPreInit.base;
		query = tinyMCEPreInit.query || '';
	} else {
		for (i=0; i<nl.length; i++) {
			src = nl[i].src;
 
			if (src && src.indexOf("tiny_mce_dev.js") != -1) {
				base = src.substring(0, src.lastIndexOf('/'));
 
				if ((p = src.indexOf('?')) != -1)
					query = src.substring(p + 1);
			}
		}
	}
 
	// Parse query string
	li = query.split('&');
	query = {};
	for (i=0; i<li.length; i++) {
		it = li[i].split('=');
		query[unescape(it[0])] = unescape(it[1]);
	}
 
	nl = null; // IE leak fix
 
	function include(u) {
		scripts.push(base + '/classes/' + u);
	};
 
	function load() {
		var i, html = '';
 
		for (i = 0; i < scripts.length; i++)
			html += '<script type="text/javascript" src="' + scripts[i] + '"></script>\n';
 
		document.write(html);
	};
 
	// Firebug
	if (query.debug && !("console" in window)) {
		include('firebug/firebug-lite.js');
	}
 
	// Core ns
	include('tinymce.js');
 
	// Load framework adapter
	if (query.api)
		include('adapter/' + query.api + '/adapter.js');
 
	// tinymce.util.*
	include('util/Dispatcher.js'); ...
 
	// tinymce.html.*
	include('html/Entities.js'); ...
 
	// tinymce.dom.*
	include('dom/DOMUtils.js'); ...
 
	// tinymce.ui.*
	include('ui/KeyboardNavigation.js'); ...
 
	// tinymce.*
	include('AddOnManager.js'); ...
 
	load();
}());

et il est instanci� comme �a:

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
tinyMCE.init(milestone0);

Je souhaite comprendre la m�thode de d�veloppement?

Moi j'aurais fait comme �a:

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
 
function wysiwyg(args)
	{
 
	}
 
wysiwyg.prototype.create = function()
	{
 
        }
 
var editeur = new wysiwyg();

La m�thode n'est pas la m�me et je souhaite comprendre celle de TyniMce et celle de Jquery?

[Willpower]

Je ne comprend tjs pas trop la question, � part que le code est englob� par une fonction anonyme, �a fonctionne un peu de la m�me mani�re. (enfin, je ne connais pas TinyMce donc je parle pour jQuery)

Moi j'aurais fait comme �a:

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
function wysiwyg(args){
}
wysiwyg.prototype.create = function(){
}
var editeur = new wysiwyg();

jQuery fait un truc semblable il me semble :

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
// englobage d'une fonction anonyme pour préserver les variables locales
(function(){
  // creation d'un compteur local à la librairie
  var localCount;
  // constructeur de l'objet principal
  function wysiwyg(){}
  // une methode 
  wysiwyg.prototype.create = function(){
    localCount++;
    return [arguments[0]];
  }
  // function d'initialisation de l'objet principal
  wysiwyg.prototype.init = function(){
    localCount = 0;
  }
  // création de l'objet principal
  window.editeur = new wysiwyg();
  // initialisation 
  editeur.init();
})();
// utilisation 
editeur.create("id");

le fait d'avoir un objet (myobject, editeur, $, jQuery, etc...) sert principalement de namespace pour regrouper tes m�thodes(et variables) li�es � cette librairie. car une m�thode "create" (par exemple) toute seule n'aurait pas beaucoup de sens.

[xess91]

Merci Willpower tes r�ponses sont claires,

Je ne connaissais pas cette notion pour structurer mes scripts de cette mani�re.

Je continu avec TinyMce en exemple, leur "Core" est structur� de cette mani�re:

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(win) {
 
	//Je ne comprends pas cette portion de code//
	var tinymce = {
		_init : function() 
				{
				function getBase(n) 
						{
						return t.baseURL;
						}
 
				return;
				},
 
		is : function(o, t) 
				{
				if (!t) return o !== undefined;
				if (t == 'array' && (o.hasOwnProperty && o instanceof Array)) return true;
 
				return typeof(o) == t;
				}
	};
	//
 
})(window);

La ce n'est pas du prototypage? Ca ressemble � une structure JSON, comment �a s'utilise?