how to convert plain array into nested object which is nested into parent object

Question

I'm trying to convert an plain array into object with additional parameter

Lets say, I have an object

var obj = [{
    index: 1,
    question: "If a carrier wave of 1000 kHz is used to carry the signal, the length of transmitting antenna will be equal to _____ ?",
    choices_list: ["300 m", "30 m", "3 m", "0.3 m"],
    answer: "300 m",
    explanation: "h =  c/v = 3 × 10^8/10^6 = 300 m",
},{...}
{...}
{...}
...
...]

now With the help of below code I'll convert choices_list in to object

res_quiz_data.forEach(key => {
    console.log(key.choices_list);

    const map1 = key.choices_list.map(x => {
        return { selected: false, choice: x }
    });
    console.log(map1);
})

Output

JS: [300 m, 30 m, 3 m, 0.3 m]
JS: [{
JS:   "selected": false,
JS:   "choice": "300 m"
JS: }, {
JS:   "selected": false,
JS:   "choice": "30 m"
JS: }, {
JS:   "selected": false,
JS:   "choice": "3 m"
JS: }, {
JS:   "selected": false,
JS:   "choice": "0.3 m"
JS: }]

now i need to way to modify the main Json object

Expected Output

var obj = [{
    index: 1,
    question: "If a carrier wave of 1000 kHz is used to carry the signal, the length of transmitting antenna will be equal to _____ ?",
    choices_list: [{
       "selected": false,
       "choice": "300 m"
     }, {
       "selected": false,
       "choice": "30 m"
     }, {
       "selected": false,
       "choice": "3 m"
     }, {
       "selected": false,
       "choice": "0.3 m"
     }],
    answer: "300 m",
    explanation: "h =  c/v = 3 × 10^8/10^6 = 300 m",
    },
{....},
{....},
{....},
....
....]

So what is difficulties? Just assign result to obj.choices_list nstead of map1 — Dmitry Reutov
– Dmitry Reutov, Commented Jan 7, 2020 at 7:18
@vikatakavi updated both ways, updating on the existing object and without mutating the existing object. Check below — Beginner
– Beginner, Commented Jan 7, 2020 at 7:23
you are just iterating through choices but not setting the values back to object. change const map1 = key.choices_list.map(x => { to key.choices_list = key.choices_list.map(x => { — arizafar
– arizafar, Commented Jan 7, 2020 at 7:25

Beginner · Accepted Answer · 2020-01-07 07:21:46Z

1

You can update as follows

var obj = [{
    index: 1,
    question: "If a carrier wave of 1000 kHz is used to carry the signal, the length of transmitting antenna will be equal to _____ ?",
    choices_list: ["300 m", "30 m", "3 m", "0.3 m"],
    answer: "300 m",
    explanation: "h =  c/v = 3 × 10^8/10^6 = 300 m",
}]

var output = obj.map(o => {
  o.choices_list = o.choices_list.map(choice => ({selected: false,
  choice}))
  return o
})


console.log(output)

If you want to update on the same object, you can do as follows

var _obj = [{
    index: 1,
    question: "If a carrier wave of 1000 kHz is used to carry the signal, the length of transmitting antenna will be equal to _____ ?",
    choices_list: ["300 m", "30 m", "3 m", "0.3 m"],
    answer: "300 m",
    explanation: "h =  c/v = 3 × 10^8/10^6 = 300 m",
}]

_obj.forEach(o => {
  o.choices_list = o.choices_list.map(choice => ({selected: false,
  choice}))
  return o
})


console.log(_obj)

answered Jan 7, 2020 at 7:21

Beginner

9,20011 gold badges50 silver badges94 bronze badges

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

2 Comments

vikatakavi Over a year ago

unfortunately This is the perfect answer which saved my precious time. Thank you

Beginner Over a year ago

happy to help kindly accept it if it worked for you :)

vahdet · Accepted Answer · 2020-01-07 07:38:04Z

1

Another option to make the logic simpler, you can destructure object to operate separately on choices_list and spread syntax to build up the result without caring about the unchanged fields.

const myArray = [{
  index: 1,
  question: "If a carrier wave of 1000 kHz is used to carry the signal, the length of transmitting antenna will be equal to _____ ?",
  choices_list: ["300 m", "30 m", "3 m", "0.3 m"],
  answer: "300 m",
  explanation: "h =  c/v = 3 × 10^8/10^6 = 300 m"
}, {
  index: 2,
  question: "Dummy question",
  choices_list: ["a", "b", "c", "d"],
  answer: "d",
  explanation: "none"
}]

const res = myArray.map(({choices_list, ...a}) => ({
  ...a,
  choices_list: choices_list.map(x => ({selected: false, choice: x}))
}))

console.log(res)

Note that th solution does not mutate the original array, which is generally desirable.

answered Jan 7, 2020 at 7:38

vahdet

6,78910 gold badges62 silver badges116 bronze badges

2 Comments

vikatakavi Over a year ago

May be syntax is different, but the above answer and your is giving same style of output. i don't even see timing difference in both the answer for 100 arrays.

vahdet Over a year ago

No surprise the style of the outputs are the same because they are just slightly different means of reaching the same target. So, you can take this solution as a kind of syntactical sugar with ES6 facilities.

CrystalSpider · Accepted Answer · 2020-01-07 07:38:07Z

0

Isn't

obj.forEach((entry) {
    res_quiz_data.forEach(key => {
        console.log(key.choices_list);

        const map = key.choices_list.map(x => {
            return { selected: false, choice: x }
        });
        console.log(map);
    });
    entry.choices_list = map;
});

Good enough?

edited Jan 7, 2020 at 7:38

answered Jan 7, 2020 at 7:18

CrystalSpider

3898 silver badges17 bronze badges

4 Comments

vikatakavi Over a year ago

Man i have 100 's of array of objects, how obj.choices_list works. each time it loops and i need to assign it to correspnding element only .

CrystalSpider Over a year ago

@vikatakavi then just putting everything into a loop should work.

arizafar Over a year ago

you mean key.choices_list = map1;?

CrystalSpider Over a year ago

@AZ_edited my answer with something similar to what I mean. Just need to change the res_quiz_data array for each iteration I guess. Like having another array to loop through.

Collectives™ on Stack Overflow

how to convert plain array into nested object which is nested into parent object

3 Answers 3

2 Comments

2 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related