0

Tô apanhando pra caramba pra fazer uma parada muito simples: montar um objeto em JavaScript por um array (string explodida).

Preciso montar um objeto de forma dinâmica (recursiva) assim:

{
  caneta: { cor: { hexadecimal: null } }
}

apenas com esse array: ['cor', 'caneta', 'hexadecimal']

Preciso fazer isso de forma recursiva, pois meu array pode ter 1 propriedade, ou 800.


Contexto

Tenho uma função que lê todos os formulários da minha página e monta, conforme o name de cada inputs, um objeto, e, conforme o id do formulário, armazena tudo dentro de um objeto pai (data).

Exemplo:

isso:

<form id="batata">
  <input name="tomate">
  <input name="banana" value="123">
</form>

gera um objeto assim:

batata: {
  tomate: null,
  banana: '123',
};

Tentativa fracassada e contexto completo no Gist

3
  • 1
    Não entendi o motivo de querer algo recursivo. E a ordem/hierarquia das propriedades no objeto é diferente mesmo da ordem da array, como no seu exemplo?
    – bfavaretto
    22/11/2018 às 20:33
  • Ela precisa chamar ela mesma para obter o mesmo tratamento em todos os casos, não? E sim, será do para frente.
    – bonifacio
    22/11/2018 às 20:39
  • 1
    Então no objeto é caneta/cor/hex e na array é cor/caneta/hex? É isso mesmo? Tem algum motivo pra não estar na mesma ordem? Critério?
    – bfavaretto
    22/11/2018 às 21:35

2 Respostas 2

1

Se entendi bem a pergunta, e se for para seguir a ordem das propriedades conforme consta na array (no seu exemplo tem uma inversão), não é necessário nada recursivo, basta um loop.

Veja o exemplo abaixo, com explicações linha por linha em forma de comentários:

// Lista de propriedades, considerando que uma
// é filha da outra.
var arr = ['caneta', 'cor', 'hexadecimal'];

// Guarda temporariamente cada item da array
let prop;

// Estado inicial do objeto é vazio
let obj = {};

// Referencia adicional ao objeto.
// Será modificada dentro do loop.
let path = obj;

// Loop tratando os elementos da array,
// um a um, na ordem.
while (prop = arr.shift()) {
  // Cria a propriedade atual
  // (com valor null no último nível)
  path[prop] = arr.length ? {} : null;
  
  // Path agora será o valor da propriedade
  // que acabamos de inserir.
  path = path[prop];
}

// Imprime o resultado
console.log(obj);

NOTA: Esse código altera a array original, que fica vazia ao final do loop. Se não quiser esse efeito colateral, adapte para um for(;;) normal sem uso de shift, é simples.

1

Elaborei uma alternativa utilizando funções do objeto Array do javascript que eu particularmente gosto bastante:

var obj = ['cor', 'caneta', 'hexadecimal'] 
.concat([null]) //Remover caso não queira que o ultimo seja sempre null
.reverse()
.reduce(function(a,b){
 return {[b]:a}
});
console.log(obj)

Referencias:

Array Reduce - O método reduce() executa uma função reducer (provida por você) para cada membro do array, resultando num único valor de retorno.

Array Concat - O método concat() retorna um novo array contendo todos os arrays ou valores passados como parâmetro

Array Reverse - O método reverse() inverte os itens de um array. O primeiro elemento do array se torna o último e o último torna-se o primeiro.

2
  • Boa ideia. Tenho somente dúvidas sobre suporte a esta sintaxe {[b]:a}, em engines JS mais antigos não deve funcionar.
    – bfavaretto
    23/11/2018 às 17:05
  • Sim, neste caso basta criar um objeto vazio e adicionar o valor na posição: var x = {}; x[b]= a; return x 23/11/2018 às 17:12

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .