preloader

El Objeto Global en JavaScript

El Objeto Global

El objeto global ofrece variables y funciones que están disponibles en cualquier contexto. Por defecto, estas son aquellas integradas en el lenguaje o en el entorno.

En un navegador se llama window, para Node.js es global, y en otros entornos puede tener un nombre diferente.

Recientemente, se introdujo globalThis en el lenguaje como un nombre estandarizado para el objeto global, que debería ser compatible con todos los entornos, incluidos los principales navegadores.

En este tutorial usaremos window, suponiendo que nuestro entorno es un navegador. Si tu script puede ejecutarse en otros entornos, es mejor usar globalThis en su lugar.

Se puede acceder directamente a todas las propiedades del objeto global:

				
					alert("Hello");
// es lo mismo que
window.alert("Hello");

				
			

En un navegador, las funciones y variables globales declaradas con var (¡no con let o const!) se convierten en propiedades del objeto global:

				
					var gVar = 5;

alert(window.gVar); // 5 (se convierte en una propiedad del objeto global)

				
			

Las declaraciones de función (definidas con la palabra clave function en el flujo principal del código, no las expresiones de función) tienen el mismo efecto.

¡No te confíes en esto! Este comportamiento existe por razones de compatibilidad. Los scripts modernos usan Módulos Javascript para evitar estos problemas.

Si usamos let en lugar de var, esto no ocurre:

				
					let gLet = 5;

alert(window.gLet); // undefined (no se convierte en una propiedad del objeto global)

				
			

Si un valor es tan importante que deseas que esté disponible globalmente, escríbelo directamente como una propiedad del objeto global:

				
					// Hacer que la información actual del usuario sea global para que todos los scripts puedan acceder a ella
window.currentUser = {
  name: "Juan"
};

// en otro lugar en el código
alert(currentUser.name);  // Juan

// o, si tenemos una variable local con el nombre "currentUser"
// obténla de window explícitamente (¡más seguro!)
alert(window.currentUser.name); // Juan

				
			

Dicho esto, generalmente se desaconseja el uso de variables globales. Debería haber la menor cantidad posible de ellas. El diseño del código donde una función obtiene variables de “entrada” y produce cierto “resultado” es más claro, menos propenso a errores y más fácil de probar que si usa variables externas o globales.

Uso para polyfills

Podemos usar el objeto global para verificar el soporte de características modernas del lenguaje.

Por ejemplo, comprobar si existe un objeto Promise incorporado (no existe en navegadores muy antiguos):

				
					if (!window.Promise) {
  alert("¡Tu navegador es realmente antiguo!");
}

				
			

Si no lo encuentra (suponiendo que estamos en un navegador antiguo), podemos crear “polyfills”: agregar funciones que no están soportadas por el entorno, pero que existen en el estándar moderno.

				
					if (!window.Promise) {
  window.Promise = ... // implementación personalizada del lenguaje moderno
}

				
			

Resumen

El objeto global contiene variables que deberían estar disponibles en todas partes.

Esto incluye JavaScript incorporado, tales como Array, y valores específicos del entorno, como window.innerHeight: la altura de la ventana en el navegador.

El objeto global tiene un nombre universal: globalThis.

… Pero con mayor frecuencia se hace referencia a nombres específicos del entorno de la “vieja escuela”, como window (en el navegador) y global (en Node.js).

Deberíamos almacenar valores en el objeto global solo si son verdaderamente globales para nuestro proyecto, y manteniendo su uso al mínimo.

En el navegador, a menos que estemos utilizando módulos, las funciones globales y las variables declaradas con var se convierten en propiedades del objeto global.

Para que nuestro código esté preparado para el futuro y sea más fácil de entender, debemos acceder a las propiedades del objeto global directamente, como window.x.

Related Post

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *