JAVASCRIPT
2. Objetos e Arrays
Diego Pessoa
OBJETOS
- Javascript define um tipo especial de variável chamado Objeto.
- Objetos não pertencem a classes explicitamente definidas.
- Um objeto em Javascript é uma associação de múltiplos valores, organizados por nomes.
- Tipo de dados especial que contém conjuntos de dados de outros tipos.
- Pode ser visto como uma array associativa ou lista associativa.
Objetos como listas associativas
Uma lista associativa é análoga a um dicionário.
A cada chave da lista, é associado um valor.
- "Milho" → "Amarelo"
- "Arroz" → "Branco"
- "Limão" → "Verde"
Para criar um objeto, basta associá-lo ao valor {}.
Depois, podem-se associar valores (propriedades) ao objeto usando a sintaxe:
var cores = {};
cores['milho'] = 'Amarelo';
cores['arroz'] = 'Branco';
cores['limao'] = 'Verde';
A mesma sintaxe é usada para recuperar os elementos do objeto:
document.write(cores['milho']);
criando um objeto
- É possível criar todos as propriedades de um objeto em uma única instrução:
var computers = {
'trs-80' : 'Radio Shack',
2600 : 'Atari',
'adam' : 'Coleco'
};
document.write(computers['adam'] + ', ' + computers[2600] );
Objetos
-
Para adicionar um novo elemento a um objeto já existente, basta defini-lo:
var computers = {
'trs-80' : 'Radio Shack',
2600 : 'Atari', 'adam' : 'Coleco'
};
computers['mac'] = 'Apple';
document.write(computers['adam'] + ', '
+ computers[2600] + ', '
+ computers['mac'] );
objetos
-
É possível utilizar uma sintaxe alternativa (mais comum) para acessar alguns elementos de um objeto.
objeto['nome'] → objeto.nome
-
'nome' deve seguir a convenção para nomenclatura de variáveis:
- Iniciar com letra
- Não ter espaços ou caracteres especiais
- Exemplo:
var sistemas = {
stallman : 'GNU',
'linus' : "Linux"
};
sistemas.apple = 'Mac OS X';
sistemas["microsoft"] = 'Windows';
document.write(
sistemas['stallman'] + " " );
document.write(sistemas.linus + " ");
document.write(sistemas.microsoft + " ");
document.write(sistemas["apple"]);
for/in
-
A estrutura de controle for/in serve para percorrer todas as propriedades de um objeto, mesmo que não se conheça seus nomes.
Sintaxe:
-
for(tmpvar in objeto)
- Percorre o objeto X vezes, onde X = número de propriedades do objeto.
- A cada iteração, assumem os valores:
- tmpvar → nome da propriedade atual
- objeto[tmpvar] → valor da propriedade atual
for/in - exemplo
var sistemas = {
stallman : 'GNU',
'linus' : "Linux"
};
sistemas.apple = 'Mac OS X';
sistemas["microsoft"] = 'Windows';
for (var x in sistemas) {
document.write(
x + ': ' + sistemas[x] + ' | '
);
}
associação entre objetos
Um objeto pode ter outros objetos como membros:
var comp = {};
comp.mac = {};
comp.mac.sistema = "Mac OS X";
comp.mac.fabricante = "Apple";
comp.winpc = {}
comp.winpc.sistema = "Windows";
comp.winpc.fabricante = "Microsoft";
for(tipo in comp){
document.write("<h1>" + tipo + "</h2><ul>");
for(prop in comp[tipo])
document.write("<li><em>" + prop + "</em>: " + comp[tipo][prop] + "</li>");
document.write("</ul>");
}
arrays (listas)
- Um objeto pode ser tratado como um array, que armazena uma lista seqüencial de valores.
- Os elementos de um array podem ser de qualquer tipo.
- Para criar um objeto como um array, basta usar a sintaxe []:
var vazio = [];
var primos = [2, 3, 5, 7, 11];
var outros = [ 1.1, true, "a" ];
arrays
-
Os elementos de um array são acessados pelos seus índices, que são números inteiros.
-
O primeiro elemento tem índice 0.
-
O último índice é sempre N-1, onde N é o número de elementos do array.
-
Não há necessidade de se preocupar com alocação de espaço.
arrays
- A sintaxe [] também para recuperar elementos do array, a partir do índice.
var pratos = ['Pizza', 'Chocolate', 'Lasanha', 'Feijoada'];
document.write(
"Eu quero " + pratos[2] + " com " + pratos[3] + "."
);
tamanho do array
- Todo array tem uma propriedade length, que armazena o seu tamanho.
var pratos = ['Pizza', 'Chocolate', 'Lasanha', 'Feijoada'];
document.write(
"Eu quero " + pratos.length + " pratos: ");
for(var i=0; i<pratos.length; i++)
document.write(pratos[i] + ' ');
exibindo o array
- Também é possível escrever na tela o array diretamente:
var pratos = ['Pizza', 'Chocolate','Lasanha', 'Feijoada'];
document.write(
"Eu quero " + pratos.length + " pratos: ");
document.write(pratos);
arrays
-
O comprimento do array (length) pode ser modificado diretamente em tempo de execução.
-
Elementos não inicializados recebem o valor undefined.
-
Um array é um objeto como qualquer outro.
-
Um array pode ter propriedades (como qualquer objeto).
-
As propriedades e os índices do array não se misturam.
-
Inteiros e strings que podem ser convertidas em inteiros são consideradas índices.
for/in
Text
Em um array, a estrutura for/in recupera tanto as propriedades do objeto, quanto os índices do array.
pratos = [ 'Pizza', 'Chocolate', 'Lasanha', 'Feijoada' ];
pratos['extra'] = 'Surpresa do dia'; pratos['6'] = 'Salada';
pratos[0.5] = 'Promoção';
pratos[true] = 'Molho';
document.write("Conteúdo do objeto: <ul>");
for (var x in pratos)
document.write(
'<li>' + x + ': ' + pratos[x] + '</li>'
);
document.write("</ul>");
delete
-
A palavra-chave delete pode ser usada para excluir propriedades do objeto ou índices do array.
Ao se excluir um elemento do arrays, os elemntos seguintes não são movidos.
Sintaxe:
delete objeto.nome; delete objeto['valor']; delete objeto[variável]
delete
- Exemplo:
delete pratos[2];
delete pratos.extra;
métodos
-
Javascript define alguns métodos que podem ser utilizados em arrays:
-
join
-
reverse
-
sort
-
concat
-
slice
-
splice
-
push
-
pop
-
shif
-
unshift
-
join()
-
join([separador]
-
Retorna a concatenação de todos os elementos do array, intercalados com o separador.
Se o separador não for especificado, usa- se ','.
-
var pratos = [ 'Pizza', 'Chocolate', 'Lasanha', 'Feijoada' ];
document.write( pratos.join('; ') );
Pizza; Chocolate; Lasanha; Feijoada
reverse()
-
reverse()
- Inverte a ordem os elementos do array.
var pratos = [ 'Pizza', 'Chocolate', 'Lasanha', 'Feijoada' ];
pratos.reverse();
document.write( pratos.join('; ') );
Feijoada; Lasanha; Chocolate; Pizza
sort()
-
sort()
-
Ordena os elementos do array alfabeticamente.
-
var pratos = [ 'Pizza', 'Chocolate', 'Lasanha', 'Feijoada' ];
pratos.sort();
document.write( pratos.join('; ') );
Chocolate; Feijoada; Lasanha; Pizza
concat()
-
concat(elemento+)
- Retorna um novo array, composto pela concatenação do array original com todos os argumentos.
var pratos = [ 'Pizza', 'Chocolate', 'Lasanha', 'Feijoada' ];
var novospratos = pratos.concat(
'Salada', 'Macarrão' );
document.write( novospratos );
Pizza,Chocolate,Lasanha,Feijoada,Salada,Macarrão
slice()
-
slice(início,[fim])
- Retorna um novo array contendo os elementos do array original a partir deinício, até antes do fim.
- Se fim for omitido, usa-se o último elemento.
- Números negativos podem ser usados em ambos os argumentos, significando uma contagem a partir do final do array.
var pratos = [ 'Pizza', 'Chocolate', 'Lasanha', 'Feijoada' ];
document.write( pratos.slice(1,3) + " <br>\n" );
document.write( pratos.slice(1) + " <br>\n");
document.write( pratos.slice(-2) );
Chocolate,Lasanha<br>
Chocolate,Lasanha,Feijoada<br>
Lasanha<br>
splice()
-
Remove elementos do array, nas posições
entre início e antes de fim.
-
Opcionalmente, insere novos elementos, no lugar dos removidos.
-
Modifica o array original! (não retorna um novo array).
var pratos = [ 'Pizza', 'Chocolate', 'Lasanha', 'Feijoada' ];
pratos.splice(1,2, 'Feijão', 'Arroz');
document.write(pratos);
Pizza,Feijão,Arroz,Feijoada
push()
-
Modifica o array, adicionando elementos ao
seu final.
-
Retorna o novo tamanho do array.
-
Não mescla novos arrays acrescentados.
var pratos = [ 'Pizza', 'Chocolate', 'Lasanha', 'Feijoada' ];
var x = pratos.push('Feijão', 'Arroz');
document.write( x + ' itens: ' + pratos);
6 itens: Pizza,Chocolate,Lasanha,Feijoada, Feijão,Arroz
pop()
-
pop()
- Remove o último elemento do array e o retorna.
var pratos = [ 'Pizza', 'Chocolate', 'Lasanha', 'Feijoada' ];
var ultimo = pratos.pop();
document.write(ultimo + "<br>\n");
document.write(pratos);
Feijoada<br>
Pizza,Chocolate,Lasanha
unshift()
-
Insere os elementos no início do array, na ordem
em que são especificados.
var pratos = [ 'Pizza', 'Chocolate', 'Lasanha', 'Feijoada' ];
pratos.unshift('Arroz', 'Batata', 'Cebola');
document.write(pratos);
Arroz,Batata,Cebola,Pizza,Chocolate,Lasanha,Feijoada
shift()
-
shift()
-
Remove o primeiro elemento e o retorna.
-
var pratos = [ 'Pizza', 'Chocolate', 'Lasanha', 'Feijoada' ];
var primeiro = pratos.shift();
document.write(primeiro + "<br>\n");
document.write(pratos);
Pizza<br>
Chocolate,Lasanha,Feijoada
arrays multidimensionais
-
Em Javascript, um array pode conter elementos de qualquer tipo, inclusive outros arrays.
-
Arrays que contém outros arrays podem ser visualizados como matrizes.
-
Podem ser usados para armazenar séries de dados que ocupam mais de uma dimensão.
var familia = [
[ "Fred", "Barney" ],
[ "George", "Jane", "Elroy" ],
[ "Homer", "Marge", "Bart" ],
];
document.write(
familia[1][2] + ', ' + familia[2][0]
);
Elroy, Homer
objetos e arrays
-
Arrays podem conter objetos de qualquer tipo, não apenas outros arrays.
-
Objetos também podem conter outros objetos e arrays.
-
É possível usar várias combinações de objetos e arrays, para organizar seus dados de maneira hierárquica.
familia = [ { pai : 'Fred', amigo : 'Barney'},
{ 'pai' : 'george, 'mae' : 'Jane', filho: 'Elroy'},
{ pai : 'Homer', mae : 'Marge', filho : 'Bart} ];
document.write( familia[1].mae + ', ' familia[2].filho );
percorrendo a estrutura hierárquica
-
Para percorrer estruturas hierárquicas, basta utilizar combinações de loops for ou for/in.
-
Exemplo (Objeto com Objetos):
for(nomefam in familia){
document.write(
"<h3>" + nomefam + "</h3>"
);
for(membro in familia[nomefam])
document.write(
"<strong>" + membro+ "</strong> " +
familia[nomefam][membro] + "<br>"
); }
Javascript - Objetos e arrays
By diegoep
Javascript - Objetos e arrays
- 362