El objeto window
La tienda tiene una campana. Es el párrafo #bell y empieza como blank. En esta página no hay formulario.
window es el objeto de esta pestaña. El documento, el ancho del viewport y cualquier var de un script sencillo cuelgan de él. Un let no. La página lee cuatro cosas y las junta. La línea queda same / 4 / undefined / number.
No es el vale del té
La página anterior rechazó un invitado vacío y un número de tazas fuera de 1 a 3. Su línea era need guest / ok. Esta página no mira #guest ni el campo #cups. El nombre cups aquí es un var, no un campo.
La pregunta es otra: ¿qué alcanzas a través de window?
Un solo documento
document no es una segunda copia. Es window.document. La campana hallada por window.document es la campana hallada por document.
let bell = window.document.getElementById("bell");
let also = document.getElementById("bell");
bell.textContent = window.document === document ? "same" : "no";
console.log(bell.textContent);
console.log(bell === also);
El registro es same y luego true. Un documento, una campana.
Un var cuelga de la ventana
var cups = 4 en este script crea window.cups. Leído, es el número 4. String solo lo vuelve texto para la campana.
var cups = 4;
let bell = document.getElementById("bell");
bell.textContent = String(window.cups);
console.log(bell.textContent);
El registro es 4. El 4 es la variable, no un campo de formulario.
Un let se queda fuera
let kettle = 1 existe. No es una propiedad de window. window.kettle es undefined, y String de eso es la palabra undefined.
let kettle = 1;
let bell = document.getElementById("bell");
bell.textContent = String(window.kettle);
console.log(bell.textContent);
console.log(kettle);
El registro es undefined y luego 1. La tetera existe. Simplemente no cuelga de window.
El ancho es un número
window.innerWidth es cuántos píxeles CSS tiene el viewport a lo ancho. typeof de ese valor es "number". No es texto, como sí lo es value de un input.
let bell = document.getElementById("bell");
bell.textContent = typeof window.innerWidth;
console.log(bell.textContent);
El registro es number. La cantidad de píxeles cambia con la ventana. El tipo no.
No escribas la dirección
window.location.href es la dirección de esta pestaña y es un texto. Leerla es seguro. Escribir una dirección nueva navega fuera y esta página se va. Ningún fragmento escribe en href.
Cuatro lecturas, no un formulario
Aquí no se recorta un nombre ni se comprueba un rango. Las cuatro lecturas son: si el documento es el mismo objeto, el var, el let que falta y el tipo del ancho. String(undefined) es la palabra undefined, no una campana en blanco.
La línea bajo la campana
El script está al final de body. Declara var cups = 4 y let kettle = 1, y luego empuja cuatro lecturas: si el documento coincide, window.cups, window.kettle y typeof window.innerWidth.
<!DOCTYPE html>
<html>
<head>
<title>shop-bell — page</title>
</head>
<body>
<p id="bell">blank</p>
<p id="line">…</p>
<script>
var cups = 4;
let kettle = 1;
let seen = [];
seen.push(window.document === document ? "same" : "no");
seen.push(String(window.cups));
seen.push(String(window.kettle));
seen.push(typeof window.innerWidth);
document.getElementById("line").textContent = seen.join(" / ");
</script>
</body>
</html>
La línea es same / 4 / undefined / number. El documento coincidió. El var se veía en window. El let no. El tipo del ancho es number. La palabra blank ya no está. need guest / ok es la página anterior.
En el mostrador
- Compara
window.documentcondocument. La campana muestra same. - Declara
var cups = 4y leewindow.cups. La campana muestra 4. - Declara
let kettle = 1y leewindow.kettle. La campana muestra undefined.kettlesigue siendo 1. - Lee
typeof window.innerWidth. La campana muestra number. - Lee la línea de la página: same / 4 / undefined / number.
Fallos en el mostrador
La campana muestra una de esas palabras, no un nombre de invitado.
- Esperar que
window.kettlesea 1 - Esperar que
window.cupssea undefined - Tratar
innerWidthcomo texto - Escribir en
location.hrefy salir de la página - Leer la línea como need guest / ok
Quédate con esto
window.documentydocumentson el mismo objetovar cups = 4se lee comowindow.cupslet kettle = 1no creawindow.kettletypeof window.innerWidthes number- La línea de la página es same / 4 / undefined / number
🧠 Pon a Prueba tu Conocimiento
Pon a Prueba tu Conocimiento
Ponte a prueba con este cuestionario interactivo y descubre qué tan bien entiendes el tema
📝 Instrucciones
- Lee cada pregunta cuidadosamente
- Selecciona la mejor respuesta para cada pregunta
- Puedes repetir el quiz tantas veces como quieras
- Tu progreso se mostrará en la parte superior