jQuery: funzionalità avanzate dei plugin

In questo articolo discuteremo alcuni concetti avanzati dello sviluppo di plugin jQuery che ci permetteranno di sfruttare al meglio le potenzialità di jQuery.

Fornire un accesso pubblico alle impostazioni predefinite dei plugin

Un miglioramento che possiamo ottenere dai nostri plugin è quello di esporre le loro impostazioni predefinite. Questo è importante perché permette di sovrascrivere e personalizzare i plugin con molta semplicità.

In questo caso utilizziamo le caratteristiche dell'oggetto funzione.

$.fn.hilight = function( options ) {
	var opts = $.extend( {}, $.fn.hilight.defaults, options );
	//...
	$.fn.hilight.defaults = {
		foreground: "black",
		background: "yellow"
	};
};

Ora gli utenti possono includere la seguente riga di codice nei loro script:

$.fn.hilight.defaults.foreground = "red";

Ora possiamo utilizzare il plugin usando come valore predefinito il colore rosso per il testo:

$( "#test" ).hilight();

Gli utenti possono comunque specificare un altro colore usando le opzioni del plugin:

$( "#test" ).hilight({
	foreground: "#080",
	background: "#eee"
});

Fornire un accesso pubblico alle funzioni secondarie

Questa funzionalità segue la precedente ed è un modo interessante per estendere i vostri plugin. Per esempio il nostro plugin può definire una funzione chiamata format() che formatta il testo.

$.fn.hilight = function( options ) {
	return this.each(function() {
		var $this = $( this );
		//...
		var markup = $this.html();
		
		markup = $.fn.hilight.format( markup );
		
		$this.html( markup );
	});

};

$.fn.hilight.format = function( txt ) {
	return "<strong>" + txt + "</strong>";
};

Così facendo la funzione format() diventa a tutti gli effetti un metodo pubblico del nostro plugin e può essere utilizzata anche al di fuori del suo contesto.

Creare funzioni private

Un altro modo di estendere le funzionalità dei nostri plugin è quello di creare funzioni private. Al contrario dei metodi pubblici, le funzioni private sono ad uso esclusivamente interno e non possono essere usate al di fuori del contesto del plugin.

// Closure
(function( $ ) {
	$.fn.hilight = function( options ) {
		debug( this );
	};
	
	function debug( $obj ) {
		console.log( "Plugin hilight invocato su " + $obj[0].outerHTML );
	}

})( jQuery );

Il nostro metodo di debug è privato perché il suo accesso è limitato all'interno della closure che abbiamo appena creato.