0:00:00.000,0:00:02.997
Otra forma divertida de usar JavaScript

0:00:02.997,0:00:05.620
en páginas web es animar las propiedades

0:00:05.620,0:00:08.830
con el tiempo. Sin embargo, antes de que podamos hacer eso

0:00:08.837,0:00:10.379
necesito asegurarme de que conoces

0:00:10.379,0:00:12.032
otra variable global que está disponible

0:00:12.032,0:00:14.934
en cada página web, la variable

0:00:14.934,0:00:18.334
"window". Aquí, voy a escribir

0:00:18.334,0:00:20.978
"console.log(window)" y puedes

0:00:20.978,0:00:23.145
usar la pausa y revisar tus herramientas de desarrollador

0:00:23.145,0:00:24.897
y ver lo que hay ahí dentro.

0:00:26.887,0:00:30.643
¿Lo viste? Es enorme. Contiene

0:00:30.643,0:00:34.113
tanto que es abrumador. Para hacerlo un poco

0:00:34.113,0:00:36.519
menos abrumador, te mostraré

0:00:36.519,0:00:38.436
algunas de mis propiedades y métodos favoritos

0:00:38.436,0:00:40.675
que puedes acceder en esta variable.

0:00:40.675,0:00:44.184
Existe "window.location" que tiene

0:00:44.184,0:00:46.194
mucha información sobre la URL de

0:00:46.194,0:00:50.332
la página. En realidad, vamos a seguir adelante

0:00:50.332,0:00:52.762
y a escribir esto fuera de la página para que no

0:00:52.762,0:00:55.145
tengas que poner pausa.

0:00:55.145,0:00:59.995
Así que '"textContent += "The URL of this page is" (La URL de esta página es)

0:00:59.995,0:01:04.097
+ window.location' y luego éste es

0:01:04.097,0:01:06.803
un objeto, así que tenemos que buscar dentro y

0:01:06.803,0:01:09.460
decimos "href" y aquí lo tenemos.

0:01:09.460,0:01:12.608
Ésta es en realidad la URL de la página que tenemos

0:01:12.608,0:01:14.887
de este lado.

0:01:14.887,0:01:18.466
Otra propiedad, es "window.navigator.userAgent"

0:01:18.466,0:01:21.675
que te informa sobre el navegador del

0:01:21.675,0:01:28.308
usuario. Decimos '"The user agent is "+ (El agente de usuario es)

0:01:28.308,0:01:33.063
window.navigator.userAgent;'.

0:01:33.063,0:01:36.972
Ok, esta cadena de caracteres de "userAgent" probablemente

0:01:36.972,0:01:40.639
te parezca un poco loca. No es necesariamente entendible

0:01:40.639,0:01:42.846
para las personas, y

0:01:42.846,0:01:45.116
no siempre tiene mucho sentido, por razones

0:01:45.116,0:01:48.313
históricas. Así que muchos desarrolladores usan

0:01:48.313,0:01:51.127
librerías para entender lo que en realidad esta

0:01:51.127,0:01:53.287
cadena de caracteres significa y qué navegador están usando,

0:01:53.287,0:01:56.169
y qué sistema operativo y todo eso, porque esto es

0:01:56.169,0:02:00.544
muy extraño. Aquí hay una que no es tan

0:02:00.544,0:02:05.332
extraña: "window.outerWidht" y "window.outerHeight".

0:02:05.332,0:02:12.583
Así que digamos, '"This web page is "+ (Esta página web es)

0:02:12.583,0:02:21.544
window.outerWidht + " by "+ window.outerHeight;'

0:02:21.544,0:02:24.787
A mí me dice 1280 por 715, pero probablemente

0:02:24.787,0:02:26.426
sea diferente para ti, dependiendo

0:02:26.426,0:02:29.656
de cómo se vea tu página cuando estás viendo

0:02:29.656,0:02:31.859
esta guía paso a paso.

0:02:31.859,0:02:33.928
Ahora, déjame mostrarte algo un poco

0:02:33.928,0:02:37.778
sorprendente. Voy a borrar la parte

0:02:37.778,0:02:41.472
de "window" de esta línea de código.

0:02:43.472,0:02:48.215
Lo que pasa es que sigue funcionando,

0:02:48.215,0:02:50.543
esto es porque "window" es una variable

0:02:50.543,0:02:53.242
global predeterminada en las páginas web. Cuando el

0:02:53.242,0:02:56.531
navegador busca una variable que estás usando,

0:02:56.531,0:02:59.407
la buscará en el objeto "window".

0:02:59.407,0:03:02.773
Y cuando creas una nueva variable global,

0:03:02.773,0:03:05.431
el objeto "window", en realidad,

0:03:05.431,0:03:08.025
la almacena como una propiedad.

0:03:08.025,0:03:10.482
Eso significa que no deberías declarar variables propias

0:03:10.482,0:03:13.318
con nombres como "outerWidht" y "outerHeight"

0:03:13.318,0:03:16.050
porque entonces ellas van a sobreescribir en "window.outerWidht"

0:03:16.050,0:03:18.227
y "window.outerHeight".

0:03:18.227,0:03:21.156
Generalmente, deberías evitar las variables globales

0:03:21.156,0:03:24.478
juntas porque es muy fácil que choquen entre ellas

0:03:24.478,0:03:26.090
o con otras variables existentes en el objeto

0:03:26.090,0:03:29.266
"window". Para trabajar con seguridad extra,

0:03:29.266,0:03:31.646
puedes poner prefijos en tus variables globales.

0:03:31.646,0:03:35.921
Como en Khan Academy, escribimos "KA_" delante de

0:03:35.921,0:03:39.979
cualquier variable global que debemos tener.

0:03:39.979,0:03:42.007
Ok, éste es el objeto "window",

0:03:42.007,0:03:44.427
ahora vamos a ver cómo podemos usar

0:03:44.427,0:03:48.668
dos funciones para hacer animaciones.