Difference between revisions of "Crear librería de JavaScript"

From Wiki de Caballero
Jump to navigation Jump to search
Line 29: Line 29:
<div class="mw-collapsible-content">
<div class="mw-collapsible-content">
<syntaxhighlight lang="javascript">
<syntaxhighlight lang="javascript">
( // Lo que está adentro de los parentesis solo existe adentro
( // Lo que está adentro de los parentesis solo existe adentro
function(w) {
function(w) {
var variable1 = 'unoA'; // Usando var se evita que la variable1 exista en el espacio global
var variable1 = 'unoA'; // Usando var se evita que la variable1 exista en el espacio global
var variable2 = 'dosB';
var variable2 = 'dosB';
var variable3 = {
var variable3 = {
Line 41: Line 41:
}
}
;
;
w.lib = {}; // Se crea un objeto lib para que se le puedan agregar parámetros luego
w.lib = {}; // Se crea un objeto lib para que se le puedan agregar parámetros luego
w.lib.variable2 = variable2; // Se agrega variable2 al objeto global lib
w.lib.variable2 = variable2; // Se agrega variable2 al objeto global lib
w.lib.variable3 = variable3; // Se agrega variable3 al objeto global lib
w.lib.variable3 = variable3; // Se agrega variable3 al objeto global lib
w.lib.hola = hola; // Se agrega función hola al objeto global lib
w.lib.hola = hola; // Se agrega función hola al objeto global lib
}
}
)(window); // window se envía como parámetro a la función, no es extricamente necesario
)(window); // window se envía como parámetro a la función, no es extricamente necesario
//  
//  
// *********************************
// *********************************
// Ejecución
// Ejecución
// *********************************
// *********************************
lib.hola(); // Se accede desde afuera de la librería a la función hola
lib.hola(); // Se accede desde afuera de la librería a la función hola
alert(lib.variable2); // Se accede desde afuera de la librería a la variable2
alert(lib.variable2); // Se accede desde afuera de la librería a la variable2


// *********************************
// *********************************
// Errores
// Errores
// *********************************
// *********************************
alert(variable1); // Error, variable1 no definida
alert(variable1); // Error, variable1 no definida
alert(lib.variable1); // Muestra "undefined"
alert(lib.variable1); // Muestra "undefined"
</syntaxhighlight>
</syntaxhighlight>
</div>
</div>
</div>
</div>

Revision as of 17:33, 22 May 2014

Cómo crear una librería de JavaScript sencilla

Agregando la librería al alcance global (global scope)

Un ejemplo de una librería sencilla (Expandir para ver ejemplo documentado):

(function(w) {
	var variable1 = 'unoA';
	var variable2 = 'dosB';
	var variable3 = {
		sub1: 'a',
		sub2: 'b'
	};
	function hola() {
		alert('hola');
	}
	;
	w.lib = {};
	w.lib.variable2 = variable2;
	w.lib.variable3 = variable3;
	w.lib.hola = hola;
})(window);
// *********************************
//	Ejecución
// *********************************
lib.hola();
alert(lib.variable2);
(							// Lo que está adentro de los parentesis solo existe adentro
		function(w) {
			var variable1 = 'unoA';		// Usando var se evita que la variable1 exista en el espacio global
			var variable2 = 'dosB';
			var variable3 = {
				sub1: 'a',
				sub2: 'b'
			};
			function hola() {
				alert('hola');
			}
			;
			w.lib = {};			// Se crea un objeto lib para que se le puedan agregar parámetros luego
			w.lib.variable2 = variable2;	// Se agrega variable2 al objeto global lib
			w.lib.variable3 = variable3;	// Se agrega variable3 al objeto global lib
			w.lib.hola = hola;		// Se agrega función hola al objeto global lib
		}
)(window);						// window se envía como parámetro a la función, no es extricamente necesario
// 
// *********************************
//	Ejecución
// *********************************
lib.hola();						// Se accede desde afuera de la librería a la función hola
alert(lib.variable2);					// Se accede desde afuera de la librería a la variable2

// *********************************
//	Errores
// *********************************
alert(variable1);					// Error, variable1 no definida
alert(lib.variable1);					// Muestra "undefined"