Create nested array having an element path array

Question

I have this array:

var array ={data: [
        { id:'1',
          name:'first',
          data:[]
 }]}

and i have this path: path = ['3','1','2']; How can i push data based on the path dynamically and create this:

  array.data= myData;
  array.data[3].data= myData;
  array.data[3].data[1].data =myData;
  array.data[3].data[1].data[2].data= myData;

myData stores data from a server and changes everytime

myData example

var myData = 
{ id:'5',
          name:'abc',
          data:[]
 },
{ id:'7',
          name:'def',
          data:[]
 }

The wanted result should be like this: I want to be able to create this array like that and the data to be accessible like above.

var array ={data: [
        { id:'1',
          name:'first',
          data:[]
 },{ id:'2',
          name:'first',
          data:[]
 },
{ id:'3',
          name:'first',
          data:[]
 },
{ id:'4',
          name:'first',
          data:[
                { id:'5',
                  name:'first',
                  data:[]
                },
                { id:'6',
                 name:'first',
                 data:[
                        { id:'7',
                          name:'first',
                          data:[]
                         },
                       { id:'8',
                         name:'first',
                         data:[
                                { id:'8',
                                  name:'first',
                                 data:[]
                                },
                                { id:'8',
                         name:'first',
                         data:[]
                     }]
                     }]
                }]
 }]}

I edited the question. its basically same array object which i want to push — Mendi
– Mendi, Commented Sep 18, 2019 at 7:54
please add the wanted result as well. for example, why is the first data an object, instead of an array as all following data properties? — Nina Scholz
– Nina Scholz, Commented Sep 18, 2019 at 7:56

Nina Scholz · Accepted Answer · 2019-09-18 11:36:04Z

1

You could reduce the path by preserving the last index and take the result object as start value.

Inside of reduce assign an array to data, if it does not exists and assign a new object to the data property with the actual value pf the path array as index.

var result = {},
    data = { id: '1', name: 'first' },
    path = [3, 1, 2],
    last = path.pop(),
    final = path.reduce((o, i) => {
        o.data = o.data || [];
        return o.data[i] = o.data[i] || {};
    }, result);

final[last] = Object.assign({}, data, final[last] && { data: final[last].data });

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

edited Sep 18, 2019 at 11:36

answered Sep 18, 2019 at 8:03

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Mendi Over a year ago

I want it to be nested. the 3 , 1 ,2 stands for object 4 which will have 2 nested objects and and the second nested object will have another 3 nested objects. it will be like a tree

Mendi Over a year ago

I updated the wanted result. The data is the same just with different names and ids

Nina Scholz Over a year ago

i have no idea. you have a path with three elements and two object. what should happen with it?

Mendi Over a year ago

I want to push Mydata first on array[3].data then on array[3].data[1] and then on array[3].data[1].data[2]. Mydata changes on every click i make and stores diferrent data. I achieved this the static way with for loops but the problem is if you have a path with 6 elements you will make 6 loops? i need something dynamical. Based on the path above i want my final array to be the one above

Mendi Over a year ago

on every click myData changes with the desired data inside. i just made a sample. take as example the data in the final result

|

Dacre Denny · Accepted Answer · 2019-09-18 08:02:49Z

0

If I understand your question correctly, you'd like to dynamically construct an object (ie result as shown below) that is, nested clones of the myData object from a supplied path array.

One approach to this, that would produce the required access method (ie array.data[3].data[1].data[2].data) would be via the reduceRight() method on the path array as shown:

const myData = { id: '1', name: 'first' };
const path = ['3', '1', '2'];

const array = { 
  data : path.reduceRight((acc, part) => 
    ({ [part] : { data : { ...acc, ...myData } }}), {}) 
}

console.log(array.data[3].data);
console.log(array.data[3].data[1].data);
console.log(array.data[3].data[1].data[2].data);

answered Sep 18, 2019 at 8:02

Dacre Denny

30.4k5 gold badges53 silver badges66 bronze badges

Collectives™ on Stack Overflow

Create nested array having an element path array

2 Answers 2

6 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related