Taking contents of an array of objects, and assigning them to a property on a JSON object

Question

I want to take items from this array (the way I save things on the client)

[
    {
        "id": "-Mdawqllf_-BaW63gMMM",
        "text": "Finish the backend[1]",
        "status": true,
        "time": 1625248047800
    },
    {
        "id": "-Mdawqllf_-BaW63gGHf",
        "text": "Finish the middle-end[2]",
        "status": false,
        "time": 1625248040000
    },
    {
        "id": "-Mdawqllf_-BaW63gGHd",
        "text": "Finish the front-end[3]",
        "status": false,
        "time": 1625248040000
    }
]

And turn them into this format for how I save it server side

{    "todos": {
            "-Mdawqllf_-BaW63gMMM": {
                "text": "Finish the backend[1]",
                "status": true,
                "time": 1625248047800,
                
            },
            "-Mdawqllf_-BaW63gGHf": {
                "text": "Finish the middle-end[2]",
                "status": false,
                "time": 1625248040000,
                
            },
            "-Mdawqllf_-BaW63gGHd": {
                "text": "Finish the front-end[3]",
                "status": false,
                "time": 1625248040000,
                
            }
        },
}

Basically i turn items into an array on the client to help with sorting and making use of arrays. But before sending it back need to put into the right format

Where do the `index` values come from in the result? They're not the original array indexes. — Barmar, Jul 10 '21 at 08:16

Barmar · Answer 1 · 2021-07-10T08:20:10.037

1

Use .map() to loop over the array of objects to exctract the id property, so you can use it as the key of the new object.

Use Object.fromEntries() to create the new object from the array returned by .map().

const data = [
    {
        "id": "-Mdawqllf_-BaW63gMMM",
        "text": "Finish the backend[1]",
        "status": true,
        "time": 1625248047800
    },
    {
        "id": "-Mdawqllf_-BaW63gGHf",
        "text": "Finish the middle-end[2]",
        "status": false,
        "time": 1625248040000
    },
    {
        "id": "-Mdawqllf_-BaW63gGHd",
        "text": "Finish the front-end[3]",
        "status": false,
        "time": 1625248040000
    }
];

const todos = {
  Todos: Object.fromEntries(data.map(obj => [obj.id, obj]))
};

console.log(todos);

edited Jul 10 '21 at 08:20

answered Jul 10 '21 at 07:01

Barmar

741,623
53
500
612

Unfortunately this only accounts for the first object within the array – kasmo Jul 10 '21 at 07:34
There's only one object in the array. – Barmar Jul 10 '21 at 07:37
I've updated the answer to show how to merge all the objects in the array. – Barmar Jul 10 '21 at 07:42
Ah you are right and sorry that was my mistake when setting up the question. Remove the enclosing {} so its [{...},{...},{...}] - thats what i have, an array of three objects that I would like to then have assigned to {todos: Assign here} Thanks for your help thus far - really appreciated – kasmo Jul 10 '21 at 07:50
What you've written now is not valid JavaScript. You can't have `key: value` in an array, only in an object. – Barmar Jul 10 '21 at 07:56
I'm so stupid, you are 100% right. I was taking the data from the wrong place but have edited the question to be correct. Sorry for wasting your time but the question should now be correct. – kasmo Jul 10 '21 at 08:08
You've completely changed the question now, I've written a new answer. – Barmar Jul 10 '21 at 08:20
Barmar you are a legend! Thank you :) – kasmo Jul 10 '21 at 08:26

Muhammad Atif Akram · Answer 2 · 2021-07-10T09:03:12.240

0

const items = {
      todos: {
           ...data
      }
 };

Assume that data is the array of objects. Use the spread operator to copy all the array objects from data array to the todos object at key todos.

One important thing to note that you can't assign more than one objects without array to a single object key. You definately have to use the array to maintain all the objects under the one key.

Avoid using the hardcode index. Always use the spread operator

edited Jul 10 '21 at 09:03

answered Jul 10 '21 at 07:04

Muhammad Atif Akram

1,204
1
4
12

Unfortunately I'm trying to have it not be an array.. Essentially all i want to do is remove the [ ], I also thought destructuring could help but it always come back as an array – kasmo Jul 10 '21 at 07:37
@kasmo Obviously dear you can't assign more than one value to a key of object without array. You have to be use the array – Muhammad Atif Akram Jul 10 '21 at 07:54
Muhammad, I'm so stupid, you are 100% right. I was taking the data from the wrong place but have edited the question to be correct. Sorry for wasting your time but the question should now be correct. – kasmo Jul 10 '21 at 08:09
@kasmo Hi Mate ! I just edited answer. Now you can get all the objects from main array and store all objects inside object at the key todo. I hope this will work for you – Muhammad Atif Akram Jul 10 '21 at 09:04

score 0 · Answer 3 · answered Jul 10 '21 at 08:34

0

@Barmar's solutions is nice.

For the sake of learning or others googling. You can also reduce the array to an object.

const todos = data.reduce((obj, item) => {
  obj[item.id] = item
  return obj
}, {})

answered Jul 10 '21 at 08:34

Bergur

3,962
12
20

Taking contents of an array of objects, and assigning them to a property on a JSON object

3 Answers3