Murali Elumalai
Murali Elumalai

Reputation: 49

Push parent arrays element and chidren array into new array in javascript

"items": {
"hotdrinks": [
  {
    "id": "9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
    "price": 20,
    "name": "Tea",
    "img": "../assets/img/HotDrinks/1_udupibhavan.jpg"
  },
  {
    "id": "9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
    "price": 25,
    "name": "Coffee",
    "img": "../assets/img/Hot Drinks/2_udupibhavan.jpg"
  },
  {
    "id": "9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
    "price": 50,
    "name": "Hot Milk",
    "img": "../assets/img/Hot Drinks/3_udupibhavan.jpg"
  },
  {
    "id": "9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
    "price": 70,
    "name": "Horlicks",
    "img": "../assets/img/Hot Drinks/4_udupibhavan.jpg"
  },
  {
    "id": "9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
    "price": 80,
    "name": "Badam Milk",
    "img": "../assets/img/Hot Drinks/5_udupibhavan.jpg"
  }
],

}

json i want to achieve using javascript. im just new to handling arrays and objects. thanksfound the answer given by Jeeva which works perfectly future answers are welcome since we can know diffferent methods to achieve the same json object

 dataArray = [
 {title:"Hotdrinks",
 content: [{
        "id": "9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
        "price": 20,
        "name": "Tea",
        "img": "../assets/img/HotDrinks/1_udupibhavan.jpg"
      },
      {
        "id": "9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
        "price": 80,
        "name": "Badam Milk",
        "img": "../assets/img/Hot Drinks/5_udupibhavan.jpg"
      }
]}

Upvotes: 2

Views: 134

Answers (2)

Jeeva
Jeeva

Reputation: 1590

You can use like this. This can be achieved by iterating the object.

const data = {
              "items":{
                "hotdrinks":[
                  {
                  "id":"9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
                  "price":20,
                  "name":"Tea",
                  "img":"../assets/img/HotDrinks/1_udupibhavan.jpg"
                  },
                  {
                  "id":"9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
                  "price":25,
                  "name":"Coffee",
                  "img":"../assets/img/Hot Drinks/2_udupibhavan.jpg"
                  },
                  {
                  "id":"9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
                  "price":50,
                  "name":"Hot Milk",
                  "img":"../assets/img/Hot Drinks/3_udupibhavan.jpg"
                  },
                  {
                  "id":"9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
                  "price":70,
                  "name":"Horlicks",
                  "img":"../assets/img/Hot Drinks/4_udupibhavan.jpg"
                  },
                  {
                  "id":"9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
                  "price":80,
                  "name":"Badam Milk",
                  "img":"../assets/img/Hot Drinks/5_udupibhavan.jpg"
                  }
                ]
              }
            }
            

var dataArray = []

for(k in data.items){
  var dataObj = {}
  dataObj.title = k
  dataObj.content = data.items[k]  //You can also access the object values by using bracket ([]) notation
  dataArray.push(dataObj)
  
}

console.log(JSON.stringify(dataArray))            

Upvotes: 2

Shravan Jain
Shravan Jain

Reputation: 720

The above expected output json is not valid. We can achieve the following.

[{"title":"Hotdrinks"}, {"content": [  
     {  
        "id":"9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
        "price":20,
        "name":"Tea",
        "img":"../assets/img/HotDrinks/1_udupibhavan.jpg"
     },
     {  
        "id":"9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
        "price":25,
        "name":"Coffee",
        "img":"../assets/img/Hot Drinks/2_udupibhavan.jpg"
     },
     {  
        "id":"9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
        "price":50,
        "name":"Hot Milk",
        "img":"../assets/img/Hot Drinks/3_udupibhavan.jpg"
     },
     {  
        "id":"9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
        "price":70,
        "name":"Horlicks",
        "img":"../assets/img/Hot Drinks/4_udupibhavan.jpg"
     },
     {  
        "id":"9aa113b4-1e4e-4cde-bf9d-8358fc78ea4f",
        "price":80,
        "name":"Badam Milk",
        "img":"../assets/img/Hot Drinks/5_udupibhavan.jpg"
     }
  ]}]

If you are okay with this then i'll give you the sample code for the same.

Upvotes: 0

Related Questions