[Script Info] Title: [Events] Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text Dialogue: 0,0:00:00.97,0:00:03.96,Default,,0000,0000,0000,,Sigamos explorando lo que podemos hacer con objetos. Dialogue: 0,0:00:03.96,0:00:07.98,Default,,0000,0000,0000,,Regresamos al programa que usamos en el tutorial de funciones. Dialogue: 0,0:00:07.98,0:00:14.27,Default,,0000,0000,0000,,Este programa tiene la función "drawWinston" que dibuja a "Winston" en un cierto punto "x,y". Dialogue: 0,0:00:14.27,0:00:21.52,Default,,0000,0000,0000,,Y aquí abajo, llamamos la función "drawWinston" 4 veces, cada vez con un diferente conjunto de coordenadas "x,y". Dialogue: 0,0:00:21.52,0:00:28.25,Default,,0000,0000,0000,,Bueno, ustedes me conocen y saben que cuando veo cuatro llamadas a la función "drawWinston" que se ven tan similares, Dialogue: 0,0:00:28.25,0:00:39.67,Default,,0000,0000,0000,,todo lo que puedo pensar es en la manera de mejorar este código usando un ciclo y llamar a la función sólo una vez dentro del ciclo, cambiando "x" y "y" en cada iteración del ciclo. Dialogue: 0,0:00:39.67,0:00:47.04,Default,,0000,0000,0000,,Así que para hacer eso, necesitamos encontrar una manera de almacenar estas posiciones de "x" y "y" en un arreglo para que podamos recorrerlo. Dialogue: 0,0:00:47.04,0:00:55.82,Default,,0000,0000,0000,,Bueno, tenemos dos conjuntos de valores, así que podemos tener dos arreglos. Uno para las posiciones de "x" y otro para las posiciones de "y". Dialogue: 0,0:00:55.82,0:01:09.25,Default,,0000,0000,0000,,Entonces, para las posiciones de "x" tenemos 99, 294, 101 y 294, y para las posiciones de "y" tenemos 117, 117, 316, 316. Dialogue: 0,0:01:09.25,0:01:18.40,Default,,0000,0000,0000,,Ok, ahora podemos recorrer el arreglo con un ciclo "for" con la variable "i = 0; i < xPositions.lenght; i++" Dialogue: 0,0:01:18.40,0:01:29.73,Default,,0000,0000,0000,,Así que recorremos cada elemento en "xPositions" y decimos "drawWinston(xPositions[i],yPositions[i]);" Dialogue: 0,0:01:29.73,0:01:33.93,Default,,0000,0000,0000,,Ok, vamos a ver si funciona, borramos esto... Dialogue: 0,0:01:33.93,0:01:36.20,Default,,0000,0000,0000,,Muy bien, funciona. Dialogue: 0,0:01:36.20,0:01:44.64,Default,,0000,0000,0000,,Entonces, ahora podemos simplemente llamar esto, ya sabes, tenemos sólo una línea de código que llama a "drawWinston", pero lo hace para cada posición en el arreglo "xPositions". Dialogue: 0,0:01:44.64,0:01:57.89,Default,,0000,0000,0000,,Podemos añadir más posiciones a esto escribiendo algo como 10, luego ponemos 1, luego 1, luego 1, luego 100, y 1. Dialogue: 0,0:01:57.89,0:02:08.21,Default,,0000,0000,0000,,Ahora esto se está volviendo un poco desastroso, y no me gusta porque en realidad es difícil ver cuál "x" está relacionada con cuál "y". Dialogue: 0,0:02:08.21,0:02:21.32,Default,,0000,0000,0000,,Y yo quisiera poder echar un vistazo y saber cuáles son mis pares "x,y", en lugar de tener que asegurarme de alinear perfectamente esto, tal vez. Dialogue: 0,0:02:21.32,0:02:26.73,Default,,0000,0000,0000,,Así que quiero encontrar una manera diferente de almacenar estas posiciones. Dialogue: 0,0:02:26.73,0:02:30.79,Default,,0000,0000,0000,,Una idea es que podemos almacenarlas como objetos. Dialogue: 0,0:02:30.79,0:02:44.06,Default,,0000,0000,0000,,Piensen en esto, cada posición en realidad tiene dos porciones de información: "x" y "y". Así que podemos tener un objeto que tenga las propiedades "x" y "y" y luego tener un arreglo de objetos con esas posiciones "x,y". Dialogue: 0,0:02:44.06,0:02:45.76,Default,,0000,0000,0000,,Hagámoslo. Dialogue: 0,0:02:45.76,0:02:51.40,Default,,0000,0000,0000,,Tenemos la variable "positions" igual a un arreglo. Dialogue: 0,0:02:51.40,0:02:55.85,Default,,0000,0000,0000,,Pero cada elemento del arreglo en lugar de ser un número, será un objeto. Dialogue: 0,0:02:55.85,0:03:04.69,Default,,0000,0000,0000,,Entonces aquí tenemos nuestras llaves y decimos "x: 99, y: 117". Dialogue: 0,0:03:04.69,0:03:13.39,Default,,0000,0000,0000,,Ok, ahora tenemos nuestra primer posición aquí, y vamos a añadir otra aquí. Dialogue: 0,0:03:13.39,0:03:30.90,Default,,0000,0000,0000,,Muy bien, "x" debe ser 294, 117, la tercera es 101, 316, y la última es 294 y 316. Dialogue: 0,0:03:30.90,0:03:37.52,Default,,0000,0000,0000,,Ok, ahora tenemos un arreglo de objetos y cada objeto tiene las propiedades "x" y "y". Dialogue: 0,0:03:37.52,0:03:44.23,Default,,0000,0000,0000,,Aquí abajo, en nuestro ciclo "for" sólo tenemos que cambiar esto para recorrer hasta "positions.lenght". Dialogue: 0,0:03:44.23,0:03:48.99,Default,,0000,0000,0000,,Después tenemos que pasar el objeto. Dialogue: 0,0:03:48.99,0:03:58.85,Default,,0000,0000,0000,,En este momento está pasando el objeto entero, pero lo que queremos es pasar la "x" y la "y", necesitamos "positions[i].x" y "positions[i].y". Dialogue: 0,0:03:58.85,0:04:00.23,Default,,0000,0000,0000,,¡Tan tan! Dialogue: 0,0:04:00.23,0:04:03.97,Default,,0000,0000,0000,,Ahora ya nos podemos deshacer de este grupo de arreglos. Dialogue: 0,0:04:03.97,0:04:12.69,Default,,0000,0000,0000,,Genial. Esto se ve mejor y hace que el código sea más fácil de leer, y es mejor tener un código fácil de leer. Dialogue: 0,0:04:12.69,0:04:26.60,Default,,0000,0000,0000,,También hace que sea más fácil agregar algo, así que si quiero añadir uno, y de hecho voy a añadir un par, escribo "x:" es 200, "y", 200, y tenemos un "Winston" justo en medio. Dialogue: 0,0:04:26.60,0:04:27.59,Default,,0000,0000,0000,,Genial. Dialogue: 0,0:04:27.59,0:04:31.27,Default,,0000,0000,0000,,Ahora quiero mostrarles algo más interesante. Dialogue: 0,0:04:31.27,0:04:38.64,Default,,0000,0000,0000,,Noten que nuestra función actualmente acepta dos números y luego usa esos dos números. Dialogue: 0,0:04:38.64,0:04:44.66,Default,,0000,0000,0000,,Bueno, podemos cambiar nuestra función para que reciba un objeto y luego obtenga la "x" y la "y" de ese objeto, Dialogue: 0,0:04:44.66,0:04:49.23,Default,,0000,0000,0000,,significa que aquí podríamos pasar sólo ese objeto. Dialogue: 0,0:04:49.23,0:04:50.85,Default,,0000,0000,0000,,Tratemos de hacerlo. Dialogue: 0,0:04:50.85,0:04:53.60,Default,,0000,0000,0000,,Pasamos el objeto, ahora no funciona. Dialogue: 0,0:04:53.60,0:05:00.18,Default,,0000,0000,0000,,Porque nuestra función sigue esperando dos objetos y sólo está recibiendo uno, así que tenemos que cambiar eso, Dialogue: 0,0:05:00.18,0:05:07.43,Default,,0000,0000,0000,,y decirle que reciba "facePosition", y ahora tenemos un error porque "faceX" no está definida, porque antes Dialogue: 0,0:05:07.43,0:05:13.50,Default,,0000,0000,0000,,pasabamos el argumento en "faceX" pero ahora no existe, sólo estamos recibiendo un objeto. Dialogue: 0,0:05:13.50,0:05:20.90,Default,,0000,0000,0000,,Así que lo que podemos hacer es obtener la posición de "x" del objeto y ponerla en la variable "faceX" Dialogue: 0,0:05:20.90,0:05:27.68,Default,,0000,0000,0000,,Lo que estamos haciendo es recibir este objeto y sabemos que tiene la propiedad "x", así que la almacenamos en la variable "faceX". Dialogue: 0,0:05:27.68,0:05:33.64,Default,,0000,0000,0000,,Podemos hacer lo mismo con la "y", así que escribimos "faceY = facePosition.y". Dialogue: 0,0:05:33.64,0:05:34.85,Default,,0000,0000,0000,,¡Tan tan! Dialogue: 0,0:05:34.85,0:05:38.17,Default,,0000,0000,0000,,Y luego, ya sabes, el resto de la función usa "faceX" y "faceY". Dialogue: 0,0:05:38.17,0:05:43.97,Default,,0000,0000,0000,,Ahora tenemos que estar seguros de que esté bien escrito, si ponemos "xx", no va a funcionar porque no es igual a lo que está aquí abajo Dialogue: 0,0:05:43.97,0:05:48.12,Default,,0000,0000,0000,,en nuestro arreglo de objetos, así que es necesario que coincidan. Dialogue: 0,0:05:48.12,0:05:53.94,Default,,0000,0000,0000,,Esto es muy sencillo porque ahora puedes tener arreglos de objetos, puedes tener funciones que usen objetos, Dialogue: 0,0:05:53.94,0:06:00.16,Default,,0000,0000,0000,,y puedes darte cuenta que tus programas se vuelven muy poderosos por la manera en que se estructuran los datos, Dialogue: 0,0:06:00.16,0:06:05.18,Default,,0000,0000,0000,,especialmente porque es muy frecuente que queramos usar "x" y "y" juntas. Pienso que esto Dialogue: 0,0:06:05.18,0:06:08.93,Default,,0000,0000,0000,,te será muy útil en tus programas de dibujo y animación. Dialogue: 0,0:06:08.93,0:06:11.60,Default,,0000,0000,0000,,Así que ¡practícalo y diviértete!