O m\u00e9todo JSON.parse() \u00e9 uma forma simples e eficiente de converter dados JSON em um array no JavaScript. Com este m\u00e9todo, \u00e9 poss\u00edvel transformar facilmente uma string JSON em um objeto JavaScript ou em um array, dependendo da estrutura do JSON.<\/p>\n
Para converter especificamente em um array, primeiro \u00e9 necess\u00e1rio garantir que a string JSON esteja corretamente formatada.<\/p>\n
const jsonString = '[\"ma\u00e7\u00e3\", \"banana\", \"laranja\"]';\n\n \/\/ Convertendo a string JSON em um array\n const arrayFrutas = JSON.parse(jsonString);\n\n console.log(arrayFrutas); \/\/ Sa\u00edda: [\"ma\u00e7\u00e3\", \"banana\", \"laranja\"]\n <\/code><\/pre>\nNo exemplo acima, o m\u00e9todo JSON.parse() recebe a string JSON como par\u00e2metro e retorna um objeto JavaScript ou um array, dependendo da estrutura do JSON. No nosso caso, a string JSON representa um array de frutas, e o m\u00e9todo retorna um array correspondente.<\/p>\n
A vantagem de usar o m\u00e9todo JSON.parse() \u00e9 que ele realiza automaticamente a convers\u00e3o do JSON para a estrutura de dados adequada no JavaScript. Isso simplifica bastante o processo de transformar dados JSON em formatos utiliz\u00e1veis no c\u00f3digo.<\/p>\n
Convertendo dados JSON em um array utilizando loops e arrays vazios em JavaScript<\/h2>\n
Outra maneira de converter dados JSON em um array em JavaScript \u00e9 utilizando loops e arrays vazios. Esse m\u00e9todo \u00e9 especialmente \u00fatil quando precisamos manipular ou transformar os dados JSON de forma mais personalizada.<\/p>\n
Exemplo de utiliza\u00e7\u00e3o de loops e arrays vazios<\/h3>\nconst jsonData = {\n \"frutas\": [\"ma\u00e7\u00e3\", \"banana\", \"laranja\"],\n \"legumes\": [\"cenoura\", \"batata\", \"abobrinha\"]\n };\n\n \/\/ Criando um array vazio para armazenar os valores\n const arrayDados = [];\n\n \/\/ Utilizando um loop para percorrer as chaves do objeto JSON\n for (let chave in jsonData) {\n \/\/ Verificando se a chave cont\u00e9m um array\n if (Array.isArray(jsonData[chave])) {\n \/\/ Adicionando os valores do array \u00e0 lista de dados\n arrayDados.push(...jsonData[chave]);\n }\n }\n\n console.log(arrayDados); \/\/ Sa\u00edda: [\"ma\u00e7\u00e3\", \"banana\", \"laranja\", \"cenoura\", \"batata\", \"abobrinha\"]\n <\/code><\/pre>\nNo exemplo acima, temos um objeto JSON com two chaves: “frutas” e “legumes”. Utilizando um loop for..in, verificamos se cada chave cont\u00e9m um array. Se for verdadeiro, adicionamos os elementos desse array ao nosso arrayDados utilizando o m\u00e9todo push() e o spread operator (…).<\/p>\n
Utilizando a biblioteca lodash para transformar dados JSON em um array em JavaScript<\/h2>\n
A biblioteca lodash \u00e9 uma poderosa ferramenta para trabalhar com dados no JavaScript, incluindo a convers\u00e3o de JSON para arrays. Ela oferece diversas fun\u00e7\u00f5es utilit\u00e1rias que facilitam o processamento de dados, tornando o c\u00f3digo mais limpo, leg\u00edvel e eficiente.<\/p>\n
Exemplo de utiliza\u00e7\u00e3o da biblioteca lodash<\/h3>\nconst jsonData = {\n \"frutas\": [\"ma\u00e7\u00e3\", \"banana\", \"laranja\"],\n \"legumes\": [\"cenoura\", \"batata\", \"abobrinha\"]\n };\n\n \/\/ Importando a biblioteca lodash\n const _ = require('lodash');\n\n \/\/ Convertendo o objeto JSON em um array de valores\n const arrayDados = _.values(jsonData);\n\n console.log(arrayDados); \/\/ Sa\u00edda: [[\"ma\u00e7\u00e3\", \"banana\", \"laranja\"], [\"cenoura\", \"batata\", \"abobrinha\"]]\n <\/code><\/pre>\nNo exemplo acima, importamos a biblioteca lodash utilizando o comando require(). Em seguida, utilizamos a fun\u00e7\u00e3o values() para converter o objeto JSON em um array de valores. O resultado \u00e9 um array que cont\u00e9m os arrays de frutas e legumes.<\/p>\n
Trabalhando com o m\u00e9todo Object.values() para converter dados JSON em um array em JavaScript<\/h2>\n
Al\u00e9m da biblioteca lodash, o JavaScript tamb\u00e9m disponibiliza o m\u00e9todo Object.values(), que pode ser utilizado para converter um objeto JSON em um array com os valores do objeto. Esse m\u00e9todo \u00e9 nativo do JavaScript a partir do ECMAScript 2017.<\/p>\n
Exemplo de utiliza\u00e7\u00e3o do m\u00e9todo Object.values()<\/h3>\nconst jsonData = {\n \"frutas\": [\"ma\u00e7\u00e3\", \"banana\", \"laranja\"],\n \"legumes\": [\"cenoura\", \"batata\", \"abobrinha\"]\n };\n\n \/\/ Convertendo o objeto JSON em um array de valores\n const arrayDados = Object.values(jsonData);\n\n console.log(arrayDados); \/\/ Sa\u00edda: [[\"ma\u00e7\u00e3\", \"banana\", \"laranja\"], [\"cenoura\", \"batata\", \"abobrinha\"]]\n <\/code><\/pre>\nNo exemplo acima, utilizamos o m\u00e9todo Object.values() diretamente no objeto JSON. O resultado \u00e9 um array que cont\u00e9m os arrays de frutas e legumes, exatamente como no exemplo anterior.<\/p>\n
Conclus\u00e3o<\/h2>\n
No tutorial acima, exploramos diferentes m\u00e9todos para converter dados JSON em arrays em JavaScript. O m\u00e9todo JSON.parse() fornece uma forma direta e simples de realizar a convers\u00e3o, bastando fornecer a string JSON como argumento para a fun\u00e7\u00e3o.<\/p>\n
J\u00e1 utilizando loops e arrays vazios ou as bibliotecas lodash e Object.values(), temos a flexibilidade de manipular os dados durante o processo de convers\u00e3o, permitindo transformar o objeto JSON em um array de forma mais personalizada.<\/p>\n
A escolha do m\u00e9todo depende da estrutura dos dados JSON e do objetivo da convers\u00e3o. Ambas as op\u00e7\u00f5es s\u00e3o eficazes e oferecem diferentes possibilidades de transformar dados JSON em arrays em JavaScript.<\/p>\n
Independente do m\u00e9todo escolhido, \u00e9 importante estar familiarizado com a estrutura do JSON e garantir a formata\u00e7\u00e3o correta da string JSON antes de utiliz\u00e1-la com o JSON.parse().<\/p>\n
A Awari \u00e9 a melhor plataforma para aprender programa\u00e7\u00e3o no Brasil.<\/h2>\n
Aqui voc\u00ea encontra cursos com aulas ao vivo, mentorias individuais com os melhores profissionais do mercado e suporte de carreira personalizado para dar seu pr\u00f3ximo passo profissional e aprender habilidades como Data Science, Data Analytics, Machine Learning e mais.<\/p>\n