Map json data from array with several properties

Question

I’ve the following json object

https://codebeautify.org/jsonviewer/cb01bb4d

obj = 
{
  "api": "1.0.0",
  "info": {
    "title": "Events",
    "version": "v1",
    "description": "Set of events"
  },
  "topics": {
    "cust.created.v1": {                            //Take this value
      "subscribe": {
        "summary": "Customer Register Event v2",    //Take this value
        "payload": {
          "type": "object",
          "required": [
            "storeUid"

          ],
          "properties": {
            "customerUid": {
              "type": "string",
              "description": "Email of a Customer",
              "title": "Customer uid"
            }
          }
        }
      }
    },
    "qu.orderplaced.v1": {                     //Take this value
      "subscribe": {
        "summary": "Order Placed",             //Take this value
        "payload": {
          "type": "object",
          "required": [
            "quoteCode"
          ],
          "properties": {
            "quoteCode": {
              "type": "string",
              "example": "762",
              "title": "Quote Code"
            }
          }
        }
      }
    } 
  }
}

And I need to map the values from the json objects to javascript array

E.g.:

MyArray = [
 {
   Label: “cust.created.v1”,
   Description:  "Customer Register Event v2"

 },
 {
   Label: “qu.orderplaced.v1”,
   Description: "Order Placed",
 }
]

I need to map the two values, the key => label for each instance (e.g. “cust.created.v1” ) and the summary => Description from each instance

I’ve tried to do it with map but I struggled to do it with key and the property inside, is it possible to do it with map ?

Rajneesh · Accepted Answer · 2020-06-16 09:10:12Z

6

Take entries of object then map it:

var obj = { "api": "1.0.0", "info": { "title": "Events", "version": "v1", "description": "Set of events" }, "topics": { "cust.created.v1": { "subscribe": { "summary": "Customer Register Event v2", "payload": { "type": "object", "required": [ "storeUid" ], "properties": { "customerUid": { "type": "string", "description": "Email of a Customer", "title": "Customer uid" } } } } }, "qu.orderplaced.v1": { "subscribe": { "summary": "Order Placed", "payload": { "type": "object", "required": [ "quoteCode" ], "properties": { "quoteCode": { "type": "string", "example": "762", "title": "Quote Code" } } } } }}}

var result = Object.entries(obj.topics).map(([k,v])=>({Label:k, Description:v.subscribe.summary}));

console.log(result);

answered Jun 16, 2020 at 9:10

Rajneesh

5,3181 gold badge10 silver badges20 bronze badges

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

4 Comments

Beno Odr Over a year ago

Thanks, Im running it in TS , and I got the following error: Object is of type 'unknown'.ts(2571) for this v.subscribe.summary , any idea how to overcome this?

Rajneesh Over a year ago

@BenoOdr put map(([k,v] as any) instead of map(([k,v]). It should work then

Beno Odr Over a year ago

I tried it like var result = Object.entries(obj.topics).map(([k,v] as any )=>({Label:k, Description:v.subscribe.summary})); but I got compilation error, do I miss something ?

Beno Odr Over a year ago

Fixed it like var result = Object.entries(obj.topics).map(([k,v]: any )=>({Label:k, Description:v.subscribe.summary})); , do you know pherhaps if I want to use the type explicit for TS, how should I use it ?

Al Hill · Accepted Answer · 2020-06-16 09:31:38Z

2

Object.entries is the key of your problem ;)

Object.entries(obj.topics).map(topic => ({
    Label: topic[0],
    Description: topic[1].subscribe.summary
}))

If you are not sure if topic[1].subscribe you can cover your back with topic[1].subscribe?.summary or topic[1].subscribe && topic[1].subscribe.summary

You can also destructure the inner arrays of Object.entries, maybe it's a little cleaner

const obj = { "api": "1.0.0", "info": { "title": "Events", "version": "v1", "description": "Set of events" }, "topics": { "cust.created.v1": { "subscribe": { "summary": "Customer Register Event v2", "payload": { "type": "object", "required": [ "storeUid" ], "properties": { "customerUid": { "type": "string", "description": "Email of a Customer", "title": "Customer uid" } } } } }, "qu.orderplaced.v1": { "subscribe": { "summary": "Order Placed", "payload": { "type": "object", "required": [ "quoteCode" ], "properties": { "quoteCode": { "type": "string", "example": "762", "title": "Quote Code" } } } } }}}

const arr = Object.entries(obj.topics).map(([Label, content]) => ({ 
   Label, 
   Description: content.subscribe?.summary 
}))

console.log(arr)

edited Jun 16, 2020 at 9:31

answered Jun 16, 2020 at 9:09

Al Hill

4712 silver badges6 bronze badges

1 Comment

Al Hill Over a year ago

Which error? Object.entries always returns an array with [key, value] arrays inside. You can access it destructuring the inner array like gorak did or access the key with [0] and value with [1]. Maybe topic[1].subscribe is undefined with the object you're trying?

James Burgess · Accepted Answer · 2020-06-16 09:18:23Z

1

You can map over all the keys in topics, and for each of those items, you can pull any data out of that object like so:

Object.keys(obj.topics).map((key) => { return {Label: key, Description: obj.topics[key].subscribe.summary} })

answered Jun 16, 2020 at 9:18

James Burgess

4971 gold badge4 silver badges12 bronze badges

Comments

Narendra Chouhan · Accepted Answer · 2020-06-16 09:19:08Z

You can do this way

let obj = { "api": "1.0.0", "info": { "title": "Events", "version": "v1", "description": "Set of events" }, "topics": { "cust.created.v1": { "subscribe": { "summary": "Customer Register Event v2", "payload": { "type": "object", "required": [ "storeUid" ], "properties": { "customerUid": { "type": "string", "description": "Email of a Customer", "title": "Customer uid" } } } } }, "qu.orderplaced.v1": { "subscribe": { "summary": "Order Placed", "payload": { "type": "object", "required": [ "quoteCode" ], "properties": { "quoteCode": { "type": "string", "example": "762", "title": "Quote Code" } } } } }}}


let outputArray = Object.keys(obj.topics).map((key)=>(
    { Label: key, Description: obj.topics[key]['subscribe']['summary'] }
))

console.log(outputArray)

Collectives™ on Stack Overflow

Map json data from array with several properties

4 Answers 4

4 Comments

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

4 Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related