Reglas para el desarrollo de plugins en jQuery

Para construir plugins en jQuery tenemos que seguir una serie de normas. Además veremos un nuevo ejemplo práctico sobre el desarrollo de plugins en jQuery. 

Con los plugins en jQuery podemos ampliar Framework, creando nuevos métodos para dotar de nuevas funcionalidades al objeto jQuery. En el artículo anterior ofrecimos una explicación general sobre los plugins en jQuery y en el presente vamos a adentrarnos en su desarrollo. Como habrás comprobado en el Manual de jQuery, el framework ya contiene muchas funciones para hacer cosas interesantes, que se basan en la utilización del objeto jQuery, así que ahora aprendamos a extender este objeto para proporcionar funcionalidades nuevas a nuestras páginas. 

Pero atención, porque tenemos que realizar el trabajo siguiendo una serie de normas, para asegurar que los plugins funcionen como deben y los pueda utilizar cualquier desarrollador en cualquier página web. Aquí puedes ver un listado normas, que son sólo unas pocas, pero que resultan tremendamente importantes. 

• El archivo que crees con el código de tu plugin lo debes nombrar como jquery.[nombre de tu plugin].js. Por ejemplo jquery.desaparece.js. 

• Añade las funciones como nuevos métodos por medio de la propiedad fn del objeto jQuery, para que se conviertan en métodos del propio objeto jQuery. 

• Dentro de los métodos que añades como plugins, la palabra "this" será una referencia al objeto jQuery que recibe el método. Por tanto, podemos utilizar "this" para acceder a cualquier propiedad del elemento de la página con el estamos trabajando. 

• Debes colocar un punto y coma ";" al final de cada método que crees como plugin, para que el código fuente se pueda comprimir y siga funcionando correctamente. Ese punto y coma debes colocarlo después de cerrar la llave del código de la función. 

• El método debe retornar el propio objeto jQuery sobre el que se solicitó la ejecución del plugin. Esto lo podemos conseguir con un return this; al final del código de la función. 

• Se debe usar this.each para iterar sobre todo el conjunto de elementos que puede haber seleccionados. Recordemos que los plugins se invocan sobre objetos que se obtienen con selectores y la función jQuery, por lo que pueden haberse seleccionado varios elementos y no sólo uno. Así pues, con this.each podemos iterar sobre cada uno de esos elementos seleccionados. Esto es interesante para producir código limpio, que además será compatible con selectores que correspondan con varios elementos de la página. 

• Asigna el plugin siempre al objeto jQuery, en vez de hacerlo sobre el símbolo $, así los usuarios podrán usar alias personalizados para ese plugin a través del método noConfict(), descartando los problemas que puedan haber si dos plugin tienen el mismo nombre. 

Estas reglas serán suficientes para plugins sencillos, aunque quizás en escenarios más complejos en adelante necesitaremos aplicar otras reglas para asegurarnos que todo funcione bien.