Window Object o ventana del navegador en JavaScript

En este artículo vas descubrir una lista de las funciones más interesantes que nos brinda el Window Object de JavaScript.

Se trata del objeto que permite controlar la ventana de navegación usando JavaScript.

El objeto Window contiene un montón de información y funciones relacionadas con la ventana de navegación del usuario.

Window console log

El objeto Window permite mostrar información en la consola del navegador de la siguiente forma:

window.console.log('hola');

Debido a que console log es un atributo global de la ventana también se puede utilizar de la siguiente forma:

console.log('hola');

Window Object Alert

El objeto Window tiene una función que permite mostrar una alerta en pantalla de forma intrusiva.

De la misma forma que el console log, esta función está disponible en toda la ventana. Por ese motivo, se puede utilizar de la siguiente forma:

alert('hola');

Window Object Prompt

El objeto Window tiene una función que permite interactuar con el usuario a través de ventanas adicionales con el objetivo principal de conseguir algún dato que pueda facilitar el usuario.

Por ejemplo, si quieres preguntar el nombre del usuario, puedes hacer lo siguiente:

const nombre = prompt('Escribe tu nombre');
console.log(`bienvenido ${nombre}`);

Window Object Confirm

El objeto Window tiene una función que permite al usuario confirmar una acción que vaya a realizar en la página.

Por ejemplo, para un botón de eliminar podemos agregarle un confirm y controlarlo de la siguiente forma:

if (confirm('Eliminar?')) {
    console.log('Eliminado');
} else {
    console.log('No hacer nada');
}

Altura y anchura del navegador con JavaScript

Del Window Object también podemos conseguir propiedades con cierta información del navegador para condicionar acciones.

Conseguir la altura y anchura del navegador puede ser una buena información para condicionar código según la ventana del usuario.

let altura, anchura;
 
altura = window.outerHeight;
anchura = window.outerWidth;
 
console.log(altura);
console.log(anchura);

Altura y anchura de la ventana con JavaScript

Con el objeto Window también tienes la posibilidad de conseguir la altura y anchura de la ventana sin la interfaz del navegador. Esto seguro que puede resultarte mucho más útil que lo anterior.

let altura, anchura;
 
altura = window.innerHeight;
anchura = window.innerWidth;
 
console.log(altura);
console.log(anchura);

Window Object Location

Con Window Location puedes conseguir información de la url, el archivo que se está ejecutando, la url, y muchas cosas más.

console.log(window.location);

Con Window Location Search puedes obtener los parámetros que hay en la url:

console.log(window.location.search);

Con Window Location puedes redireccionar al usuario de la siguiente forma:

window.location.href = 'http://www.jose-aguilar.com';

Window History

Puedes navegar por el historial de navegación del usuario de la siguiente forma:

window.history.go(-2);

El parámetro -2 indica la posición de la página web que vio anteriormente. En este caso, se volverá atrás a la penúltima página que visitó el usuario.

Window Object Navigator

Con Window Navigator puedes obtener información relacionado con el navegador web que utiliza el usuario.

console.log(window.navigator);

Conclusión

En el Window Object puedes encontrar muchísima información y funciones que te puede resultar muy útil para hacer más sencillo tu código.

Por ejemplo, para detectar el navegador o el alto y ancho de la ventana no vas a necesitar utilizar un plugin como en otras librerías o lenguajes de programación. Puedes aprovecharte del objeto Window para sacar toda esta información y mucho más.

Autor
Escrito por Jose Aguilar - Director ejecutivo y tecnológico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.
Te ha servido? Valora esta entrada!
(1 votos, promedio: 5 de 5)
Comparte en las redes sociales

Deja una respuesta

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

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Ver más sobre