Matriz em JavaScript - O que é? Para que serve? (Array de arrays)

Neste tutorial de nosso Curso de JavaScript, vamos aprender o conceito de matrizes, também conhecidas como array de arrays ou array multidimensional.

• Estudar Matriz pela Apostila em PDF

Matriz em JavaScript - O que é ?

Durante toda nossa seção de arrays em JS, dissemos que um array pode ser composto de qualquer objeto ou número ou booleano ou o que for. Usamos apenas arrays de uma única dimensão, por exemplo:

• vetor[10]
• meuArray[2112]
• nomes[100]

É apenas uma lista, com uma série de objetos dentro (números, strings etc).
Mas também é comum um array conter outros arrays. É o que chamamos de matriz (a seguir você vai entender o motivo).

É um array normal, mas em vez do primeiro elemento ser um número, é outro array.
Em vez de um segundo elemento ser uma string, é outro array. E assim vai.

E dentro desses arrays interno? Ué, pode colocar o que você quiser também.

Matriz - Para que serve?

Lembra das aulas de matemáticas, quando estudou matrizes e determinantes?
Matriz era uma espécia de tabela, formada por linhas e colunas.

Uma matrix: M(i,j) tem 'i' linhas e 'j' colunas, e é representada assim:

a(11) -> primeira linha, primeira coluna
a(12) -> primeira linha, segunda coluna
a(13) -> primeira linha, terceira coluna

a(21) -> segunda linha, primeira coluna
a(22) -> segunda linha, segunda coluna
a(23) -> segunda linha, terceira coluna

a(31) -> terceira linha, primeira coluna
a(32) -> terceira linha, segunda coluna
a(33) -> terceira linha, terceira coluna

Uma planilha do Excel, por exemplo, é uma matriz.

Um tabuleiro de damas, xadrez ou outro jogo como o jogo da velha, é uma matriz.

Matriz - Array de Array

Vamos pegar uma matriz 3x3 (ou seja, três linhas e três colunas):

Agora vamos aprender a 'ver' esta matriz como um array de arrays.

Imagine um array com três elementos:

var matriz = new Array(3);

O primeiro elemento é um array, que tem dentro os números: 1, 2, 3

O segundo elemento é um array, que tem dentro os números: 4, 5, 6

O terceiro elemento é um array, que tem dentro os números: 7, 8, 9

Veja:

Conseguiu visualizar agora?

É como se:

matriz[0] = [1, 2, 3]

matriz[1] = [4, 5, 6]

matriz[2] = [7, 8, 9]

Ou seja, cada linha é um array. E a matriz que tem 3 linhas, é um array com 3 arrays dentro.

A única diferença pra matriz que estudamos no colégio é que em vez de contar linha 1, linha 2 e linha 3, contamos linha 0, linha 1 e linha 2, pois em programação tudo começa no 0 e não no 1.

O mesmo vale para as colunas.

Veja como definir a localização de cada número

Linha 0, coluna 0 = 1

Linha 0, coluna 1 = 2

Linha 0, coluna 2 = 3

Linha 1, coluna 0 = 4

Linha 1, coluna 1 = 5

Linha 1, coluna 2 = 6

Linha 2, coluna 0 = 7

Linha 2, coluna 1 = 8

Linha 2, coluna 2 = 9

Essa matriz é uma de duas dimensões: linha e coluna.

No próximo tutorial vamos te ensinar como declarar, inicializar,  exibir, acessar e mudar os itens de uma matriz, usando programação JavaScript.