Arrays bidimensionales en JavaScript
En este tutorial aprenderemos cómo trabajar con arrays bidimensionales en JavaScript.
Un array de dos dimensiones no es más que un array dentro de otro, es decir, un array de arrays.
Para trabajar con arrays de más de 2 dimensiones puedes ver nuestro tutorial
Arrays multidimensionales en JavaScript
Si declaramos un array de 10 posiciones y en cada posición guardamos un array de 10 posiciones obtenemos un array bidimensional de 10 x 10, similar a una tabla de 10 filas y 10 columnas.
Declaración de un array bidimensional
Veamos un ejemplo sencillo de un array de 2 X 2:
var nuevoArray = new Array(2); // En cada posición de nuevoArray guardamos un nuevo array nuevoArray[0] = new Array(2); nuevoArray[1] = new Array(2);
Acceder a los datos de arrays bidimensionales
Podemos acceder a los datos de la siguiente forma:
// Accedemos a la fila 0, columna 1 nuevoArray[0][1];
Veamos un ejemplo gráfico para entenderlo mejor. Declaramos un array de 2 x 2 en el que introduciremos números
// Declaramos el array bidimensional var nuevoArray = new Array(2); nuevoArray[0] = new Array(2); nuevoArray[1] = new Array(2); // Metemos un dato en cada posición nuevoArray[0][0] = 25; nuevoArray[0][1] = 12; nuevoArray[1][0] = 34; nuevoArray[1][1] = 6;
El resultado sería algo como:
TABLA | COLUMNA 0 | COLUMNA 1 |
---|---|---|
FILA 0 | posición 0,0 = 25 | posición 0,1 = 12 |
FILA 1 | posición 1,0 = 34 | posición 1,1 = 6 |
Si queremos acceder al array anterior lo haríamos accediendo a cada posición del array de la siguiente forma
var dato = nuevoArray[0][1]; // dato ahora vale 12
Aunque se pueden crear arrays bidimensionales de manera manual como en el ejemplo anterior, lo normal es hacerlo mediante bucles. Veamos un ejemplo de un array bidimensional de 10 x 10 creado dentro de un bucle for. Cada vuelta del bucle añadirá un elemento al array.
// Declaración del array de 10 posiciones var nuevoArray = new Array(10); // Bucle para meter en cada posición otros array de 10 for(var i=0; i<10; i++) { nuevoArray[i] = new Array(10); }
Recorrer arrays bidimensionales
Si para recorrer un array de una posición utilizábamos un bucle for, haremos lo mismo pero usando dos bucles for, uno dentro de otro.
// Bucle que recorre el primer array for(var i=0; i<10; i++) { // Bucle que recorre el array que está en la posición i for(var j=0; j<10; j++) { document.write(nuevoArray[i][j]); } }
En el ejemplo anterior sabemos que se trata de un array bidimensional de 10 × 10, pero puede que no conozcamos el tamaño del array. Para estos casos vamos a ver un ejemplo utilizando el método length
// Bucle que recorre el primer array for(var i=0; i<nuevoArray.length; i++) { // Bucle que recorre el array que está en la posición i for(var j=0; j<nuevoArray[i].length; j++) { document.write(nuevoArray[i][j]); } }
Métodos de arrays en JavaScript