Arrays em JavaScript

Arrays são fundamentais em linguagens de programação. JavaScript possui sua própria forma e sintaxe para trabalhar com eles. Alguns métodos são específicos para iterar arrays e acessar seus elementos também. Vamos aprender nesse post como trabalhar com arrays em JavaScript.

O que é e como criar um Array em JavaScript

Um array, ou vetor, como também é chamado em algumas traduções para português, é uma coleção de dados para a qual é alocado um espaço contínuo de memória. Na verdade, essa é a definição clássica, mas em JavaScript não é bem assim. 

Em JS um array é um objeto, com um construtor único, propriedades e métodos herdados do protótipo array. Do ponto de vista de programação, essa forma de utilização de arrays é benéfica pois simplifica o uso e manuseio de arrays, mas tem como drawback uma pequena perda de performance.

Manipular arrays pode se tornar uma tarefa extremamente propensa a erros e dores de cabeça dependendo da linguagem e do que você precisa fazer. Em JavaScript, graças aos métodos e propriedades do protótipo Array, essa manipulação fica muito mais fácil.

Para criar um array, você pode usar a sintaxe literal, como nos exemplos abaixo:

var nomes = [“Joao”, “Pedro”, “Dany”, “Maria”];
Var idades = [22, 59, 37, 16];

Usando a sintaxe literal a declaração de arrays é feita da mesma forma que nas linguagens tradicionais. Uma outra forma de criar um array é usando o construtor new. Veja no próximo exemplo:

var nomes = new Array(8)
var idades = new Array(22, 59, 37, 16);

Fazendo dessa forma é preciso entender as diferenças das duas declarações feitas acima. O array nomes é um array com 8 posições, mas nós não atribuímos nenhum valor a nenhuma delas. Já o array idades possui 4 posições, cada qual com o valor especificado na criação (22,59,37,16). Ou seja, se usarmos o método lenght, para saber o tamanho de cada array, vamos ler o seguinte:

nomes.length;
Saída: 8

idades.length;
Saída: 4 

Portanto, fique atento à forma com que você declara seus arrays caso opte por usar o construtor new. Em geral, devido a existência da sintaxe literal, ela é a preferida dos programadores.

Como ler elementos de um array em JavaScript?

Primeiro, uma informação importante. Arrays podem ter elementos de qualquer tipo, inclusive de tipos diferentes num mesmo array. Assim você pode criar um array como abaixo:

var vetorVariosTipos= [“Leandro”, 24, “Lucia, Exemplo.ex1];

No exemplo acima temos duas strings, um inteiro e um objeto no qual acessamos o elemento ex1.

Para acessar os elementos de um array pode-se utilizar o índice de cada posição ou então os identificadores de propriedades, uma vez que os elementos de um Array em JavaScript são propriedades de um objeto. Assim, você pode usar as seguintes notações para acessar os elementos de um array:

vetorVariosTipos[‘0’]; //Leandro – elemento acessado pela notação de propriedades
vetorVariosTipos[2]; //Lucia – elemento acessado pelo índice tradicional(numero da posicao)

Agora que sabemos declarar e acessar os elementos 

Como iterar elementos em um array?

Tradicionalmente os programadores usam o loop for para iterar arrays. Em JavaScript você pode escolher algumas estruturas de loops que são feitas exclusivamente para trabalhar com Arrays. Os principais são os loops forEach() e map().

O forEach executa um bloco de código para cada elemento do array. O tamanho do array, seus tipos e outras características são identificadas automaticamente pelo forEach().

Veja o exemplo:

O forEach() chama uma função para cada elemento de um array, de acordo com o índice definido na sua chamada. Esse método é mais facilmente compreendido diretamente pelo exemplo, vamos a ele:

var vetor=[1, 3, “E ai” ,”Ola”];
vetor.forEach(function(item, index){
console.log(‘ vetor[‘+index+’] is ‘+ item);
});
No exemplo acima, a saída será:
vetor[0] e 1
vetor[1] e 2
vetor[2] e E ai
Vetor[3] e Ola

Esse exemplo é o mesmo do post anterior “Estruturas de Loop em JavaScript”. Lá detalhamos, além do forEach, os outros 6 tipos de loops que o JS possui, incluindo o map. Que tal aproveitar a deixa e conferir o post?

Agora você conhece as três operações mais importante dos Arrays em JS: Criação, acesso de elementos e iteração. Com esses conhecimentos você já consegue manipular arrays e implementá-los em seus códigos de forma eficiente e correta.

Não perca os próximos posts e continue a aprender a sempre. Bons estudos.