Utilizando o método JSON.parse() para converter dados JSON em um array

O método JSON.parse()

O método JSON.parse() é uma forma simples e eficiente de converter dados JSON em um array no JavaScript. Com este método, é possível transformar facilmente uma string JSON em um objeto JavaScript ou em um array, dependendo da estrutura do JSON.

Para converter especificamente em um array, primeiro é necessário garantir que a string JSON esteja corretamente formatada.

Exemplo de utilização do método JSON.parse()

const jsonString = '["maçã", "banana", "laranja"]';

  // Convertendo a string JSON em um array
  const arrayFrutas = JSON.parse(jsonString);

  console.log(arrayFrutas); // Saída: ["maçã", "banana", "laranja"]
  

No exemplo acima, o método JSON.parse() recebe a string JSON como parâmetro 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étodo retorna um array correspondente.

A vantagem de usar o método JSON.parse() é que ele realiza automaticamente a conversão do JSON para a estrutura de dados adequada no JavaScript. Isso simplifica bastante o processo de transformar dados JSON em formatos utilizáveis no código.

Convertendo dados JSON em um array utilizando loops e arrays vazios em JavaScript

Outra maneira de converter dados JSON em um array em JavaScript é utilizando loops e arrays vazios. Esse método é especialmente útil quando precisamos manipular ou transformar os dados JSON de forma mais personalizada.

Exemplo de utilização de loops e arrays vazios

const jsonData = {
    "frutas": ["maçã", "banana", "laranja"],
    "legumes": ["cenoura", "batata", "abobrinha"]
  };

  // Criando um array vazio para armazenar os valores
  const arrayDados = [];

  // Utilizando um loop para percorrer as chaves do objeto JSON
  for (let chave in jsonData) {
    // Verificando se a chave contém um array
    if (Array.isArray(jsonData[chave])) {
      // Adicionando os valores do array à lista de dados
      arrayDados.push(...jsonData[chave]);
    }
  }

  console.log(arrayDados); // Saída: ["maçã", "banana", "laranja", "cenoura", "batata", "abobrinha"]
  

No exemplo acima, temos um objeto JSON com two chaves: “frutas” e “legumes”. Utilizando um loop for..in, verificamos se cada chave contém um array. Se for verdadeiro, adicionamos os elementos desse array ao nosso arrayDados utilizando o método push() e o spread operator (…).

Utilizando a biblioteca lodash para transformar dados JSON em um array em JavaScript

A biblioteca lodash é uma poderosa ferramenta para trabalhar com dados no JavaScript, incluindo a conversão de JSON para arrays. Ela oferece diversas funções utilitárias que facilitam o processamento de dados, tornando o código mais limpo, legível e eficiente.

Exemplo de utilização da biblioteca lodash

const jsonData = {
    "frutas": ["maçã", "banana", "laranja"],
    "legumes": ["cenoura", "batata", "abobrinha"]
  };

  // Importando a biblioteca lodash
  const _ = require('lodash');

  // Convertendo o objeto JSON em um array de valores
  const arrayDados = _.values(jsonData);

  console.log(arrayDados); // Saída: [["maçã", "banana", "laranja"], ["cenoura", "batata", "abobrinha"]]
  

No exemplo acima, importamos a biblioteca lodash utilizando o comando require(). Em seguida, utilizamos a função values() para converter o objeto JSON em um array de valores. O resultado é um array que contém os arrays de frutas e legumes.

Trabalhando com o método Object.values() para converter dados JSON em um array em JavaScript

Além da biblioteca lodash, o JavaScript também disponibiliza o método Object.values(), que pode ser utilizado para converter um objeto JSON em um array com os valores do objeto. Esse método é nativo do JavaScript a partir do ECMAScript 2017.

Exemplo de utilização do método Object.values()

const jsonData = {
    "frutas": ["maçã", "banana", "laranja"],
    "legumes": ["cenoura", "batata", "abobrinha"]
  };

  // Convertendo o objeto JSON em um array de valores
  const arrayDados = Object.values(jsonData);

  console.log(arrayDados); // Saída: [["maçã", "banana", "laranja"], ["cenoura", "batata", "abobrinha"]]
  

No exemplo acima, utilizamos o método Object.values() diretamente no objeto JSON. O resultado é um array que contém os arrays de frutas e legumes, exatamente como no exemplo anterior.

Conclusão

No tutorial acima, exploramos diferentes métodos para converter dados JSON em arrays em JavaScript. O método JSON.parse() fornece uma forma direta e simples de realizar a conversão, bastando fornecer a string JSON como argumento para a função.

Já utilizando loops e arrays vazios ou as bibliotecas lodash e Object.values(), temos a flexibilidade de manipular os dados durante o processo de conversão, permitindo transformar o objeto JSON em um array de forma mais personalizada.

A escolha do método depende da estrutura dos dados JSON e do objetivo da conversão. Ambas as opções são eficazes e oferecem diferentes possibilidades de transformar dados JSON em arrays em JavaScript.

Independente do método escolhido, é importante estar familiarizado com a estrutura do JSON e garantir a formatação correta da string JSON antes de utilizá-la com o JSON.parse().

A Awari é a melhor plataforma para aprender programação no Brasil.

Aqui você encontra cursos com aulas ao vivo, mentorias individuais com os melhores profissionais do mercado e suporte de carreira personalizado para dar seu próximo passo profissional e aprender habilidades como Data Science, Data Analytics, Machine Learning e mais.

Já pensou em aprender de maneira individualizada com profissionais que atuam em empresas como Nubank, Amazon e Google? Clique aqui para se inscrever na Awari e começar a construir agora mesmo o próximo capítulo da sua carreira em dados.