1

Gostaria de saber se é possível criar um array multidimensional já setando valores nele.

Em PHP, por exemplo, é possível que eu faça:

$data['teste1']['teste2']['teste3'] = 'valor';

Que automaticamente é criado um array com os índices um dentro do outro. Seria possível seguindo o mesmo princípio fazer a mesma coisa em JavaScript?

Quando eu faço:

const data = [];
data['teste']['teste2']['teste3'] = 'valor'

Recebo a mensagem:

Cannot read property 'teste2' of undefined

O que acho estranho é que para o primeiro índice ('teste') ele é criado, apenas não acha/cria o segundo índice.

5
  • 1
    Apesar de ser parecido, essa notação data['teste']['teste2']['teste3'] é comumente usada para acessar/alterar propriedades aninhadas de um objeto que não é necessariamente um array. Isso seria o mesmo que acessar/modificar uma propriedade aninhada de um objeto desta forma: data.teste.teste2.teste3. No JS, pense na seguinte forma, ele começa a atribuir valores da direita para a esquerda (nesse seu exemplo), logo como o indice teste3 não existe, ele vai gerar esse erro, o mesmo vale para o teste2. Commented 28/01/2022 às 23:31
  • 1
    Para o seu caso funcionar, deveria fazer algo do tipo: data['teste'] = []; data['teste']['teste2'] = []; data['teste']['teste2']['teste3'] = 'valor';, mas não acho muito elegante. Commented 28/01/2022 às 23:31
  • Entendo, mas se fosse lido da direita para a esquerda o erro seria logo no teste3, não concorda? Sobre declarar cada índice do array como um novo array, também não gosto, já que no meu caso vou ter por volta de uns 60 índices, imagina criar isso tudo somente para atribuir um valor depois. Commented 29/01/2022 às 2:04
  • 1
    @CmteCardeal Sempre que vc tem uma tarefa que se repete e tem um padrão, pode generalizar para um loop, veja minha resposta abaixo :-)
    – hkotsubo
    Commented 29/01/2022 às 16:46
  • A chave para entender a diferença de comportamento entra as linguagens ocorre por conta do o objeto Array em PHP e o objeto Array em JavaScript remeterem a estruturas de dados distintas. O Array em PHP implementa a estrutura de dados HashTable enquanto o Array em JS implementa a estrutura de dados Lista. Commented 29/01/2022 às 21:58

2 Respostas 2

2

Primeiro temos que esclarecer um detalhe: a notação de colchetes em JavaScript não necessariamente está acessando/criando índices de um array. Na verdade, neste caso você está acessando/criando propriedades de um objeto.

Basicamente, data['teste'] é o mesmo que data.teste (leia aqui e aqui para mais detalhes).

E portanto data['teste']['teste2']['teste3'] é o mesmo que data.teste.teste2.teste3. Mas como neste caso nenhuma das propriedades existe, então data.teste é undefined (pois ao tentar acessar uma propriedade inexistente de um objeto, o resultado é undefined), e ao tentar acessar a propriedade teste2 de undefined, dá erro.

Então o jeito é ir criando os objetos um a um, e atribuir as propriedades em cada nível. Como é um processo meio tedioso e repetitivo, você pode criar uma função que recebe o objeto, os nomes das propriedades e o valor a ser setado no último nível. Algo assim:

function createNestedProps(obj, props, value) {
    for (var ptr = obj, i = 0; i < props.length; i++) {
        ptr = (ptr[props[i]] = (i === props.length - 1 ? value : {}));
    }
}

var data = {};
createNestedProps(data, ['teste', 'teste2', 'teste3'], 'valor');
console.log(data);

Basicamente, ele cria um novo objeto para cada propriedade, exceto para o último, que possuirá o valor indicado.

O resultado é:

{
  "teste": {
    "teste2": {
      "teste3": "valor"
    }
  }
}

Repare que não é um array e sim um objeto (está delimitado por {} e não por []). Afinal, estamos tratando de propriedades, não de índices numéricos. PHP não faz tal distinção, pois seus arrays podem ter índices numéricos e textuais, mas em JavaScript há esta diferença.

Na verdade é um pouco mais complicado que isso, mas aí já foge demais do escopo da pergunta. Em todo caso, pode ler aqui, aqui, aqui e aqui. Ver também a documentação da linguagem sobre arrays:

"Arrays cannot use strings as element indexes but must use integers. Setting or accessing via non-integers using bracket notation (or dot notation) will not set or retrieve an element from the array list itself, but will set or access a variable associated with that array's object property collection."


Vale lembrar que o código acima sobrescreve as propriedades intermediárias, caso elas existam.

Mas se a ideia é mantê-las (caso existam), e só sobrescrever a última, basta mudar para:

function createNestedProps(obj, props, value) {
    for (var ptr = obj, i = 0; i < props.length; i++) {
        // se é a última, sobrescreve
        if (i === props.length - 1) {
            ptr[props[i]] = value;
        } else if (! ptr.hasOwnProperty(props[i])) {
            // se a propriedade não existe, cria
            ptr[props[i]] = {};
        }
        // passa para o objeto no próximo nível
        ptr = ptr[props[i]];
    }
}

// "teste" já existe e não será sobrescrito
var data = { teste: { a: 1 } };
createNestedProps(data, ['teste', 'teste2', 'teste3'], 'valor');
console.log(data);

Assim, a propriedade teste (que já existe) não é sobrescrita, e em vez disso teste2 é adicionada a ela. O resultado é:

{
  "teste": {
    "a": 1,
    "teste2": {
      "teste3": "valor"
    }
  }
}
-4

É possível sim, tente algo como:

let data = [
    ['teste1', 'valor'],
    ['teste2', 'valor'],
    ['teste3', 'valor'],
];

console.log(data);

Caso queira adicionar algum item a mais no seu array basta executar data.push(['teste4', 'valor'])

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 .