Obter a quantidade de dados que um objeto tem no JavaScript é muito simples, porém não tão usual quanto encontrar a quantidade de dados de um array comum.
Vamos rever como usualmente fazemos a contagem de dados em um array.
Para este primeiro exemplo, vamos criar um array que guarda uma lista de cores, para então contar os dados desse array.
Construindo nosso array:
let colors = [ 'red', 'blue', 'green', 'yellow', 'ciano', 'magenta', 'black', 'white' ];
Se você já não é tão iniciante nos estudos com Javascript, provavelmente até aqui não há nada novo sob o céu da Noruega.
Ao efetuar um console.log desse array:
let colors = [ 'red', 'blue', 'green', 'yellow', 'ciano', 'magenta', 'black', 'white' ]; console.log(colors);
Teremos então como retorno algo parecido com:
(8) ['red', 'blue', 'green', 'yellow', 'ciano', 'magenta', 'black', 'white']
Dessa forma, para obter a quantidade de dados dentro do array, fazemos assim:
let colors = [ 'red', 'blue', 'green', 'yellow', 'ciano', 'magenta', 'black', 'white' ]; console.log(colors.length);
A propriedade length ("comprimento" em tradução do inglês), é o que vai te dizer quantos dados o array tem.
Naturalmente, qualquer um que já esteja familiarizado com este comando, tentaria utiliza-lo num objeto. Será que funciona?
Vamos criar então um objeto para testar essa hipótese. Nosso objeto será um objeto que guarda as características de um carro:
let carro = { marca: 'Bugatti', modelo: 'Veyron', cor: ['Azul', 'Preto'], disposicao_cilindros: 'W', cilindros: 16, cilindrada: '8000', valvulas: 60, turbos: 4, potencia: 1200, aro: 20 }; console.log(carro);
O resultado do console.log será algo parecido com:
{marca: 'Bugatti', modelo: 'Veyron', cor: Array(2), disposicao_cilindros: 'W', cilindros: 16, …}
Então ao testar o console.log com length:
let carro = { marca: 'Bugatti', modelo: 'Veyron', cor: ['Azul', 'Preto'], disposicao_cilindros: 'W', cilindros: 16, cilindrada: '8000', valvulas: 60, turbos: 4, potencia: 1200, aro: 20 }; console.log(carro.length);
Teremos undefined como resultado.
A causa disso é que no JavaScript quase tudo é um objeto, e a propriedade length foi criada especificamente para se obter o número de elementos dentro de matrizes (arrays) ou número de caracteres em uma string. Dessa forma objetos literais não possuem a propriedade length.
E agora é a hora você me diz: "Beleza, Augusto. E agora?". Vamos resolver isso...
Para se obter a quantidade de dados de dentro de um objeto literal no JavaScript, precisamos obter um array contendo a lista de propriedades desse objeto. Quero dizer, obter a lista dos "nomes" dos dados de forma propriamente dita:
let carro = { marca: 'Bugatti', modelo: 'Veyron', cor: ['Azul', 'Preto'], disposicao_cilindros: 'W', cilindros: 16, cilindrada: '8000', valvulas: 60, turbos: 4, potencia: 1200, aro: 20 }; console.log(Object.keys(carro));
Utilizamos o método Object.keys para obter um array com as "keys" do objeto. O resultado do console.log será algo parecido com:
['marca', 'modelo', 'cor', 'disposicao_cilindros', 'cilindros', 'cilindrada', 'potencia', 'aro']
Agora tudo ficou muito mais simples! Nós voltamos à nossa situação do primeiro exemplo. Agora tendo um array como resultado, nós podemos acessar a propriedade length desse array:
let carro = { marca: 'Bugatti', modelo: 'Veyron', cor: ['Azul', 'Preto'], disposicao_cilindros: 'W', cilindros: 16, cilindrada: '8000', valvulas: 60, turbos: 4, potencia: 1200, aro: 20 }; console.log(Object.keys(carro).length);
Podemos também armazenar as propriedades do carro em outra variável para trabalhar em outros locais do script. Veja:
let carro = { marca: 'Bugatti', modelo: 'Veyron', cor: ['Azul', 'Preto'], disposicao_cilindros: 'W', cilindros: 16, cilindrada: '8000', valvulas: 60, turbos: 4, potencia: 1200, aro: 20 }; let propriedadesDoCarro = Object.keys(carro); console.log(propriedadesDoCarro.length);
Em ambos exemplos o resultado do console.log será: 10.