moving the key of an object into its value to create an array of objects

Question

I have an object I want to build a table out of however I need to use the value of the key as a part of the data displayed. My data looks like this:

{
    templates: {
      some_visit_1: {
        template: "A long block or rich text",
        editedAt: "timestamp",
        editedBy: "name",
      },
      some_visit_2: {
        template: "A different block of rich text",
        editedAt: "timestamp",
        editedBy: "Name",
      },
    },
  },

Ive tried using

let data = result.templates;
const templates = Object.entries(data);

But this gives me nested arrays inside with the key as one value and an object as the second. I would like to create an array of objects where each object contains the key and all values inside the initial object.

Taking this a step further I thought I could map over the new array and spread the data into an object but this just causes errors.

const templates = Object.entries(data).map((item, idx) => {
        const values = item[1];
        return {
          ...items,
          items: {
            name: item[0],
            editedAt: item[1].editedAt,
            editedBy: item[1].editedBy,
            template: item[1].template,
          },
        };
      });

Is there a method to combine the key and all values in an object into a single object?

like this:

[
   {
       {
        name: some_visit_1,
        template: "A long block or rich text",
        editedAt: "timestamp",
        editedBy: "name",
      },
      {
        name: some_visit_2,
        template: "A different block of rich text",
        editedAt: "timestamp",
        editedBy: "Name",
      }
]

What is your expected output if you have another key in your outermost object (such as templates2) with a nested object similar to the one you have now for templates, or is that not a possible case. Your expected output currently has an additional { which would throw a syntax error (not sure if this is there by mistake or whether you intended your objects to be wrapped in some sort of container?) — Nick Parsons
– Nick Parsons, Commented Dec 20, 2021 at 6:28

kiranvj · Accepted Answer · 2021-12-20 06:28:49Z

2

Is this what is expected?. I used Object.entries and map

let data = {
  templates: {
    some_visit_1: {
      template: "A long block or rich text",
      editedAt: "timestamp",
      editedBy: "name",
    },
    some_visit_2: {
      template: "A different block of rich text",
      editedAt: "timestamp",
      editedBy: "Name",
    },
  },
}
let result = Object.entries(data.templates).map(([key, value]) => {
  return {
    name: key,
    ...value,

  }
});

console.log(result);

answered Dec 20, 2021 at 6:28

kiranvj

34.2k8 gold badges75 silver badges81 bronze badges

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

3 Comments

Gass Over a year ago

First time I see map(([key, value]) => { could you explain how it works?

kiranvj Over a year ago

@Gass Object.entries returns an array of key and values of each item in the object. So the return of Object.entries will be an array of arrays example: [ [key1, value of key1], [key2, value of key2], [key3, value of key key 3] ] - continued in 2nd comment

kiranvj Over a year ago

@Gass (cont...) When we use a map the first argument will the the current element which is iterated by the map. So we can either access the element like .map(item=> {}) and get the key by item[0] and value by item[1] or we can use like .map(([key, value])=> {}) . This is basically destructing the array.

Collectives™ on Stack Overflow

moving the key of an object into its value to create an array of objects

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related