singuska :: JavaScript

Vetores (ou arrays em inglês) são listas de informações. Pode ser uma lista de números, de strings, de outros vetores, de objetos ou de funções. Vetores servem para agrupar dados similares

Imagine que tenhamos que guardar o nome de três carros que vieram de um formulário. É necessário exibir um alerta se um dos carros possuir o nome Civic.

1
2
3
4
5
6
7
8

var
c1 = 'Fiesta',
c2 = 'Palio',
c3 = 'Civic';
 
if (c1 === 'Civic' || c2 === 'Civic' || c3 === 'Civic') {
    alert('Parabéns, você tem um Civic!');
}

Após um tempo em produção, formulário precisa agora ter 4 campos para de entrada. Atualizado, o novo código seria o seguinte:

1
2
3
4
5
6
7
8
9

var
c1 = 'Fiesta',
c2 = 'Palio',
c3 = 'Civic',
c4 = 'Fox';
 
if (c1 === 'Civic' || c2 === 'Civic' || c3 === 'Civic' || c4 == 'Civic') {
    alert('Parabéns, você tem um Civic!');
}

De cara dá para perceber que este código não é nem um pouco prático de ser atualizado. Uitilizando vetores, é possível agrupar os carros em uma única variável. Além disso, as informações armazenadas em um vetor são facilmente acessadas:

1
2
3
4
5
6
7

var carros = ['Fiesta', 'Palio', 'Civic', 'Fox']
 
for (indice in carros) {
    if(carros[indice] === 'Civic') {
        alert('Parabéns, você tem um Civic!');
    }
}

Acessando os elementos de um vetor

Além de strings, os vetores podem conter números:

1
2
3

var lista = [5, 25, 40];
 
alert(lista[1]);

Para acessarmos os valores do vetor lista precisamos utilizar um índice. O primeiro índice de um vetor é sempre 0. Por isso o resultado deste código é 25. O índice 1 é na verdade o segundo índice do vetor.

Podemos também misturar tipos diferentes de dados em um mesmo vetor:

1
2
3

var lista = ['bananas', 10];
 
alert(lista[0]);

Para inicializarmos uma lista como vazia e depois adicionar um elemento:

1
2
3
4
5

var lista = [];
lista.push('abacaxi');
lista.push('goiaba');
 
alert(lista[1]);

É também possível adicionar valores fora de sequência:

1
2
3
4
5

var lista = [];
lista[5] = 'melancia';
 
alert(lista[5]);
alert(lista[0]);

A tentativa de acesso ao índice 0 retorna undefined neste caso, pois o único índice existente é 5. Vetores podem também ser declarados utilizando-se a palavra reservada Array:

1
2
3

var lista = new Array(30, 60, 90);
 
alert(lista[2]);

A utilização de [ ] é mais prática e considerada boa prática, entretanto.

Vetores com variáveis e com outros vetores dentro

Elementos de vetores podem, obviamente, ser variáveis:

1
2
3
4

var meuCarro = 'Fiesta';
var lista = ['Sandero', meuCarro, 'Fox'];
 
alert(lista[1]);

Um vetor dentro de outro:

1
2
3
4
5

// exemplo-7
var numeros = [40, 45, 50]
var lista = [10, 30, numeros];
 
alert(lista[2][1]);

O nível de profundidade dos vetores em JavaScript não é definido e é dado apenas pelo limite da memória (e pelo seu bom senso, claro).

Quantidade de elementos de um vetor

1
2
3

var lista = [12, 24, 48];
 
alert(lista.length);

A propriedade length nos retorna um número indicando quantos elementos um vetor tem. Isso é muito importante e útil, pois nos permite “passear” pelo vetor:

1
2
3
4
5

var lista = ['primeiro', 'segundo', 'terceiro'];
 
for (var i = 0; i < lista.length; i++) {
    alert('Índice: ' + i + ' valor: ' + lista[i]);
}

Para finalizar, uma brincadeira inútil:

1
2
3
4
5
6
7
8
9
10
11

var lista = [
    'motocicleta',
    [30, function() {
        alert('Olá')
        }
     ]
];
 
alert(lista[0,0]);
 
lista[1][1]();