Estaba observando el código fuente de la biblioteca jQuery y noté una cosa. Al final de toda la biblioteca, un método verifica si hay alguna otra función llamada jQuery o $ en el objeto global.
De todos modos, aquí está ese método:
var // Map over jQuery in case of overwrite _jQuery = window.jQuery, // Map over the $ in case of overwrite _$ = window.$; jQuery.noConflict = function( deep ) { if ( window.$ === jQuery ) { window.$ = _$; } if ( deep && window.jQuery === jQuery ) { window.jQuery = _jQuery; } return jQuery; };
No podía entender lo que deep
realmente hace aquí. ¿Cómo tener una situación de copia profunda puede cambiar el resultado de esa función?
Según la documentación de jQuery, la función jQuery.noConflict()
restaura la variable global window.$
a su valor anterior, antes de que se inicializara jQuery:
Muchas bibliotecas de JavaScript usan
$
como función o nombre de variable, tal como lo hace jQuery. En el caso de jQuery,$
es solo un alias parajQuery
, por lo que toda la funcionalidad está disponible sin usar$
. Si necesita usar otra biblioteca de JavaScript junto con jQuery, devuelva el control de $ a la otra biblioteca con una llamada a$.noConflict()
. Las referencias antiguas de$
se guardan durante la inicialización de jQuery;noConflict()
simplemente los restaura.
Cuando se inicializa, jQuery sobrescribe la variable global $
. Si está utilizando otra biblioteca que escribe en window.$
, jQuery puede sobrescribir window.$
, lo que hace que la otra biblioteca se rompa.
En tales casos, puede llamar a jQuery.noConflict()
para que jQuery restaure window.$
a su valor anterior. Dado que jQuery también está disponible a través de window.jQuery
, aún puede usar jQuery después de llamar a noConfilct()
(por ejemplo, escribiendo window.jQuery("#id")
).
Pero, ¿qué sucede si está ejecutando dos versiones de jQuery en la misma página? En este caso, la segunda versión sobrescribirá tanto window.$
como window.jQuery
, lo que significa que no tendrá acceso a la primera versión de jQuery después de que se inicialice la segunda versión.
Aquí es donde entra en juego el parámetro deep
. Este parámetro no está relacionado con la "copia profunda", es más como una "limpieza profunda". llamar a jQuery.noConflict(true)
restaura tanto window.$
como window.jQuery
. Si llama a esta función desde la segunda versión que cargó, restaurará la primera versión en el ámbito global.
Ahora echemos otro vistazo al código que mencionaste:
var _jQuery = window.jQuery, // Store the previous value of `window.jQuery` _$ = window.$; // Store the previous value of `window.$` jQuery.noConflict = function( deep ) { if ( window.$ === jQuery ) { window.$ = _$; // Restore `window.$` to the value we previously stored in the variable } if ( deep && window.jQuery === jQuery ) { window.jQuery = _jQuery; // If called with the parameter `deep`, also restore `window.jQuery` } return jQuery; // Return a reference to this version of jQuery };