[] -> colchetes representam uma matrizCompreender a estrutura dos dados que uma API retorna é importante porque influencia a maneira como você recupera os valores necessários. À direita, clique no botão "Obter Mensagem" para carregar o JSON da API do FreeCodeCamp Cat Photo no HTML. O primeiro e último caractere que você vê nos dados JSON são colchetes
{} -> colchetes encaracolados representam um objeto
"" -> Aspas duplas representam uma string. Eles também são usados para nomes de chaves no JSON
[ ]
. Isso significa que os dados retornados são uma matriz. O segundo caractere nos dados JSON é um colchete {
cruzado, que inicia um objeto. Olhando de perto, você pode ver que existem três objetos separados. Os dados JSON são uma matriz de três objetos, onde cada objeto contém informações sobre uma foto de gato. Você aprendeu anteriormente que os objetos contêm "pares de valores-chave" separados por vírgulas. No exemplo Cat Photo, o primeiro objeto tem "id":0
onde "id" é uma chave e 0 é seu valor correspondente. Da mesma forma, existem chaves para "imageLink", "altText" e "codeNames". Cada objeto de foto de gato tem essas mesmas chaves, mas com valores diferentes. Outro par "chave-valor" interessante no primeiro objeto é "codeNames":["Juggernaut","Mrs. Wallace","ButterCup"]
. Aqui "codeNames" é a chave e seu valor é uma matriz de três strings. É possível ter matrizes de objetos, bem como uma chave com uma matriz como um valor. Lembre-se de como acessar dados em matrizes e objetos. Os arrays usam a notação de colchetes para acessar um índice específico de um item. Os objetos usam a notação entre colchetes ou pontos para acessar o valor de uma determinada propriedade. Aqui está um exemplo que imprime o "altText" da primeira foto do gato - note que os dados JSON analisados no editor são salvos em uma variável chamada json
: console.log (json [0] .altText);
// Prints "Um gato branco usando um capacete verde em forma de melão na cabeça."
codeNames
. Você deve usar a notação de colchetes e pontos no objeto (que é salvo na variável json
) para acessar o valor. ```