¿Por qué ocurrió el error «$no está definido» en jQuery?

Uno de los errores más comunes que enfrentan los desarrolladores de jQuery es el error ‘$no está definido’. Al principio, puede parecer un pequeño error, pero considerando el hecho de que más del 70 por ciento del sitio web usa jQuery de una forma u otra, esto puede convertirse en un gran lío.

Razón detrás de este error: 
este error surge básicamente cuando el desarrollador está usando una variable, antes de declararla en el script. 

Ejemplo:  

// ReferenceError: num is not defined
num;
 
declaration
var num;
 
// No more errors
data;

Producción: 
 

En el ejemplo anterior, vemos que se ha llamado a ‘num’ antes de declararlo. Esta es la razón por la que ReferenceError: num no está definido se arrojó en la primera línea. En la tercera línea, se vuelve a llamar ‘num’. Sin embargo, esta vez no se arrojará ningún error, ya que la variable ya se definió en la segunda línea del script.

Este es un error muy común. La mejor manera de evitar esto es izar todas las variables y funciones antes de llamarlas. Echa un vistazo a otro ejemplo. 

Ejemplo:  

//reference error
process();
 
process = function(){
var a = 2;
console.log(a);
}
 
// no error
process();

Producción: 
 

Razones más comunes para este error: 

• Incrustar el complemento jQuery antes de que el archivo de script jQuery 
  ‘$’ se use para declarar cualquier variable en jQuery. Un complemento es básicamente un fragmento de código escrito de antemano. Estos fragmentos utilizan funciones y métodos jQuery predefinidos. Por lo tanto, es necesario incrustar el archivo de script jQuery antes del archivo del complemento. De lo contrario, la aplicación no entenderá la codificación jQuery.

Orden correcto: 

<script src="/lib/jquery.min.js"></script>
<script src="/lib/jquery.plugin.js"></script>

• Problema de jQuery alojado en CDN: 
  es posible que la versión jQuery alojada en CDN, utilizada para el sitio web, se haya bloqueado en la conexión del cliente. Este tipo de problema generalmente se observa en las direcciones IP que se originan en países como China, Indonesia, Corea, etc. 
  Para evitar este problema, es mejor proporcionar una versión alternativa de jQuery alojada localmente.

Ejemplo: 

//an external CDN link
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
</script>
 
//fall back to local jQuery
<script>
window.jQuery || document.write('
<script src="http://www.mywebsite.com/jquery.min.js"><\/script>'))
</script>