Eu não resisti e usei Javascript essa ultima semana inteira - É a minha confissão de hoje na reunião de javascriptólatras anônimos - Passei um perrengue danado por causa de suas peculiaridades. Tudo causado por falta de atenção a uma das pequenas regrinhas que essa linguagem viciante tem. Para evitar que outros passem pelo mesmo problema, compartilho aqui minha dor.
Em primeiro lugar é preciso verificar que somente arrays têm o atributo length. Em segundo que arrays podem se comportar como objetos, e objetos podem se comportar como arrays, e que arrays são objetos. Entendeu? Bom, vamos aos exemplos pra ficar mais claro.
var eu = { nome:"Tiago",idade:25 }; //Criando um objeto dinâmico com {}
alert( eu["nome"] ) //Acessando como se fosse um mapa
alert( eu.idade ) //Acessando como um atributo
eu.sexo = "Sempre"; //Criando um novo atributo
alert( eu["sexo"] );
eu["altura"] = 1.75; //Criando um novo atributo como mapa
alert( eu.altura );
No exemplo acima eu crio um objeto dinamicamente utilizando chaves além de acessar e criar novos atributos, de duas formas possíveis: Como se fosse um mapa, utilizando o operado colchetes, e da maneira mais comum, que é utilizando o operador ponto. Vamos seguir então para o próximo exemplo:
var eu = []; //Criando um array com []
eu.nome = "Tiago"; //Setando atributo em um array? Que coisa estranha
eu["idade"] = 25 //Não era um array, por que está aceitando uma chave como se fosse um mapa?
alert( eu["nome"] ) //Acessando como se fosse um mapa
alert( eu.idade ) //Acessando como um atributo
eu.sexo = "Sempre"; //Criando um novo atributo
alert( eu["sexo"] );
eu["altura"] = 1.75; //Criando um novo atributo como mapa
alert( eu.altura );
Neste exemplo criamos um array ao invés de um objeto, e qual não é nossa surpresa ao perceber que, exceto pela incialização, o comportamento dele fica exatamente igual ao de um objeto. Isso ocorre porque um array é um objeto. Até aí tudo parece maravilhoso. A coisa desanta quando você resolve usar o comportamento de array, num array tratado como objeto. Vejamos:
var eu = [];
alert(eu.length); //Tamanho 0 oras, não coloquei nada aqui ainda
eu["nome"] = "Tiago"; //Inserindo um atributo
alert(eu.length); //Tamanho 0?? E o atributo que botei?
eu.idade = 25; //Inserindo outro atributo
alert(eu.length); //Tamanho 0 de novo????
eu[0] = "primeiro indice"; //Adicionando elementos ao array
eu[1] = "segundo indice";
alert(eu.length); //Ahhh agora sim
eu.push("terceiro indice");
eu.push("quarto indice");
alert(eu.length); //Ahhh agora sim de novo
No exemplo acima podemos perceber o quão confuso começa a ficar. Basicamente o atributo length passa a só funcionar quando inserimos elementos no array. Ou seja, os atributos inseridos no array ficam fora do array. Isso fica mais evidente fazendo as iterações como as do exemplo abaixo:
//agora vamos iterar só pelos elementos do array
for(i=0; i {
alert("elemento do array: " + eu[i]);
}
//agora vamos iterar sobre tudo que tiver aí
for(i in eu)
{
alert("atributo do objeto: " + eu[i]);
}
//De novo somente elementos do array
while(eu.length>0)
{
alert("Remove elemento: " + eu.pop());
}
Na primeira eu itero sobre números, logo somente sobre os elementos do array. No segundo eu itero sobre as chaves, sejam elas numéricas, sejam de texto. E finalmente no terceiro eu itero removendo os elementos do array. Mas ainda sim podem ocorrer algumas curiosidades que podem nos confundir, veja abaixo:
var eu = [];
eu[0] = "primeiro indice";
eu[1] = "segundo indice";
eu["1"] = "substitui segundo indice"; //Isso aqui é o mesmo que eu[1]
alert(eu[1]); //Vai alertar a mesma coisa que o alerta de baixo
alert(eu["1"]);
eu["length"] = 0; //Vou sacanear o array agora
alert(eu.length); //Zerei o tamanho
alert(eu[4]); //Ih!!! Apagou tudo
Perceba que adicionar um elemento ao indice 1 como número é o mesmo que adicionar ao 1 como string. Além disso, veja que podemos alterar o valor do tamanho, atributo length, do array somente atribuindo um valor a ele. Isso pode causar grandes problemas, ainda mais se você estiver guardando dados digitados pelo usuário como se o array fosse um mapa.
Um exemplo simples é um usuário preenchendo um formulário com campo de nome e valor, ao clicar em um botão esses dados são inseridos no array como se fosse um mapa. Digamos que ele preencha da seguinte maneira:
Nome | Valor:
---------------------
"país" | "brasil"
10 | "isso"
7 | "hoje"
"olha" | "caso"
"length" | 0
Neste caso quando ele digitar o nome 10, o array passará a ter 10 posições, mas no momento que ele digitar "length" com o valor 0, os dados que ele inseriu com nome 10 e 7 desaparecerão. Para debugar isso você terá que arrancar vários tufos de seu cabelo.
E é aí finalmente que chegamos ao ponto crucial. Para evitar esse tipo de problema o ideal é deixar bem separado o que é array, inicializando com [] e o que é objeto inicializando com {}. Isso porque para objetos, um atributo com nome length não tem poder algum, exceto se você implementá-lo para que tenha.
