Cómo utilizar matrices para simplificar los datos en su juego html5

Juegos HTML5 están a punto de datos a menudo eso significa un mucho

de datos. Una matriz es la mayoría de los programadores de herramientas básicas tienen para gestionar grandes cantidades de datos. javascript soporta un mecanismo conjunto simple pero muy potente y flexible que te permite hacer un montón con matrices.

Una matriz es en realidad una idea- muy simple es simplemente una lista. Ya ha utilizado listas muchas veces en la codificación HTML, pero en la programación, las listas se denominan matrices, y tienen características especiales. Este ejemplo tiene dos arrays - una lista de los libros escritos por un autor encantador y endiabladamente guapo, y algunos de los temas, dijo el autor escribe sobre.

Esta página tiene cuatro componentes principales:

• Estructura HTML: Tiene una forma con dos botones. los cuerpo llama una función de inicialización cuando se carga, y cada botón llama a su propia función. La página también tiene una div llamado salida.

• Un en eso() función: Esta función proporciona acceso a la div salida, y también cargas de hasta las dos matrices descritas en este ejemplo. Las matrices suelen requerir algún tipo de inicialización.

• los showBooks () función: Usted se sorprenderá y sorprendido de que esta función muestra una serie de títulos de libros.

• los showTitles () función: Esta función muestra otra manera de caminar a través de los elementos de una matriz.

¿Cómo construir matrices del juego

Las matrices se crean con frecuencia como variables globales, ya que a menudo se utilizan en todo el programa (y en algunos idiomas, pasando un array como parámetro puede ser un poco complicado).

En este programa, usted puede crear una serie de variables en el espacio global e inicializar todos ellos en el en eso() función llamada con body.onload.

 init var salida-var libros-var temas-function () {// inicializar la producción y arreglos // desde basicArrays.htmloutput = document.getElementById ("salida") - libros = Array ("Juego de programación Flash para Dummies", "Juego La programación, la Línea L "," HTML / XHTML / CSS Todo en Uno "," javascript y AJAX para Dummies "," Referencia HTML5 rápida ") - Temas = array (5) -Temas [0] =" -Temas HTML5 " [1] = -Temas "CSS3" [2] = -Temas "javascript" [4] = "AJAX" -} // init final

La creación de las matrices es la parte más importante del proceso:

1. Creación de variables para las matrices.

   Hay dos matrices en este ejemplo, libros y temas. Cada uno se crea como cualquier otra variable, con el var comunicado. También se crea un salida variable para contener una referencia a la salida div.

2. Construir un en eso() funcionar para inicializar variables.

   Dado que los programas se hacen más complejos, es común tener una función de inicialización para configurar todo. Esta función se llama con body.onload.

3. Construir el salida variable.

   Debido a que todas las otras funciones usarán salida, se crea en en eso().

4. Utilizar el Array () función para crear la matriz de libros.

   Esta función especial se utiliza para crear un conjunto de elementos. Tenga en cuenta que utiliza una mayúscula LA. (Si tiene que ser de carácter técnico, se trata de un constructor para una Matriz objeto, pero en javascript, que es una función, también.)

5. Basta enumerar cada libro como un parámetro en el Array () función.

   Si usted alimenta a la Matriz funciona una serie de valores, se convierten en los valores de la matriz. Esta técnica es ideal si usted ya sabe lo que va a ir a cada elemento cuando se genera la matriz.

6. Construir la matriz temas de manera diferente.

   los temas array es construido con una técnica diferente. En esta matriz, se puede especificar un solo número entero, que es el número de elementos de la matriz contendrá.

7. Utilice el operador de índice para añadir elementos a la matriz.

   Todos los elementos de la matriz tienen el mismo nombre, pero tienen un número diferente. Utilice corchetes con un número entero para referirse a un elemento específico de la matriz. Tenga en cuenta que los elementos de matriz siempre comienzan con el elemento cero.

Si ha utilizado matrices en otros lenguajes de programación, usted encontrará las matrices de javascript a ser muy indulgente. Tenga cuidado, sin embargo, porque las matrices son una de las características que soporta todos los idiomas, pero todos ellos trabajan un poco diferente. Usted realmente va a encontrar los arrays javascript son más como el Lista de arreglo en Java o el Vector clase en C ++ de la matriz tradicional en cualquiera de estos idiomas.

La matriz de libros para preparar sus juegos

Las matrices son maravillosos porque permiten a empacar una gran cantidad de datos en una sola variable. Muy a menudo, cuando se tiene una matriz, usted querrá hacer algo con cada elemento de la matriz. La estructura más común de hacer esto es un para lazo. Mirar showBooks () para un ejemplo:

 showBooks function () {// desde basicArrays.htmloutput.innerHTML = "" -para (i = 0- i lt; books.length- i ++) {output.innerHTML + = libros [i] + "
"-} // Fin de bucle} // showBooks finales

Esta función pasos a través de la lista de libros e imprime el nombre de cada uno en la zona de salida:

1. Desactive la salida div.

   Salida ya se ha definido en el en eso() función, así que es bastante fácil de limpiar su valor en la función.

2. Construir un circuito para la longitud de la matriz.

   Arrays y para bucles son socios naturales. En este lazo, usted tiene yo contar desde cero hasta el número de elementos en el array.

3. Comience con cero.

   Índices de matriz siempre comienzan con cero, por lo que la variable de conteo también debe comenzar en cero (en la mayoría de los casos).

4. Utilice la propiedad length para determinar el tiempo que la matriz es.

   Cuando se construye una para bucle para recorrer una matriz, lo que realmente quieres saber es cuántos elementos hay en la matriz. Usar arrayName.length para determinar el número de elementos en la matriz actual, donde nombreArray es el nombre de la matriz actual. De esta manera, incluso si el número de elementos en los cambios de la matriz, el bucle todavía funciona correctamente.

5. Los datos de proceso dentro del bucle.

   Si la variable de conteo es yo, cada elemento de la matriz es nombreArray [i] dentro del bucle. Usted puede hacer lo que quiera con los datos.