jQuery fn.extend ({bla: function () {}} vs. jQuery.fn.bla

OK, creo que me sale la diferencia entre jQuery.extend y jQuery.fn.extend?

en que la extensión general puede extender cualquier objeto, y que fn.extend es para funciones de complemento que pueden invocarse directamente desde el objeto jQuery con algún vudú interno de jQuery.

Así que parece que uno los invocaría de manera diferente. Si usa la extensión general para extender el objeto obj agregando la función y, entonces el método se adjuntará a ese objeto, obj.y (), pero si usa fn.extend, se adjuntarán directamente al objeto jquery $ .y (). … ¿Tengo el correcto sí o no y, si no, qué entiendo mal en mi entendimiento?

Ahora mi pregunta:

El libro que estoy leyendo defiende usando

jQuery.fn.extend({ a: function() { }, b: function() { } }); 

syntax pero en los documentos dice

 jQuery.fn.a = function() { }; 

y supongo que si quisieras b también sería

 jQuery.fn.b = function() { }; 

¿Son equivalentes desde el punto de vista funcional y de rendimiento? Si no, ¿cuál es la diferencia?

Muchas gracias. Estoy cavando jQuery!

Hay una diferencia muy sutil entre ellos. En cuanto al rendimiento (no es que esto sea un problema), jQuery.fn.extend será más lento que declarar directamente una función como jQuery.fn.foo = function(){ }; . Estoy hablando de la diferencia totalmente despreciable .

La diferencia es que jQuery.fn.extend() permite agregar múltiples funciones de complementos simultáneamente y puede hacer que su código se vea un poco más limpio según el tipo de complemento que esté creando.


 jQuery.fn.a = function(){}; jQuery.fn.b = function(){}; 

Es exactamente lo mismo que

 jQuery.fn.extend({ a: function(){ }, b: function(){ } }); 

Ambas formas son casi idénticas. Sin embargo, existen algunas pequeñas diferencias, en los siguientes aspectos:

  1. Velocidad
  2. Estilo de código
  3. Nombrando tu plugin en otra parte

Velocidad

Despreciable. Puede ignorar este aspecto ya que es poco probable que note diferencias de rendimiento entre los dos.

Estilo de código :

La versión extendida se adhiere al estilo del código literal del Objeto, que puede parecer un poco más elegante para algunos. Por ejemplo, si su complemento usa el literal Objeto abundantemente, puede preferir envolverlo usando $ .extend ({}).

Poniendo nombre a tu plugin en otra parte :

Hay otra ventaja (significativa, en mi opinión) en el uso del estilo $ .fn.a: puede almacenar el nombre de su complemento en cualquier lugar, en cualquier parte de su código, y luego usar su referencia al agregar el complemento al espacio de nombres de jQuery. Esto no se puede hacer al extender utilizando un objeto literal. Esta ventaja es algo relativa a la longitud de su código y al número de apariciones del nombre del complemento. También se podría argumentar que el codificador promedio rara vez cambia el nombre de su complemento, y si lo hace, no tomará mucho tiempo en la mayoría de los casos.

Ejemplo :

 ;(function($) { // Declare your plugin's name here var PLUGIN_NS = 'myPluginName'; // ... some arbitrary code here ... // The jQuery plugin hook $.fn[ PLUGIN_NS ] = function( args ) { if ( $.type(args) !== 'object' ) var args = {}; var options = $.extend({}, $.fn[ PLUGIN_NS ].defaults, args); // iterate over each matching element return this.each({ var obj = $(this); // we can still use PLUGIN_NS inside the plugin obj.data( PLUGIN_NS+'Data' , args ); // ... rest of plugin code ... }); }; // ---------------- // PRIVATE defaults // ---------------- var defaults = { foo: 1, bar: "bar" }; // ------------------------------------------------------------ // PUBLIC defaults // returns a copy of private defaults. // public methods cannot change the private defaults var. // ------------------------------------------------------------ // we can use PLUGIN_NS outside the plugin too. $.fn[ PLUGIN_NS ].defaults = function() { return $.extend({}, defaults); }; })(jQuery); 

Ahora podemos llamar al complemento, y por defecto, así:

 $("div#myDiv").myPluginName({foo:2}); var originalFoo = $("div#myDiv").myPluginName.defaults().foo; 

Para cambiar el nombre del complemento, cambie la var. PLUGIN_NS . Esto puede ser preferible a cambiar cada aparición de myPluginName dentro del código del complemento.

    Intereting Posts