add new field in every json object in a array javascript

user_16134191 0
Viewed 1976

I am working on a react app where I am fetching a JSON response from a route which is basically a list of JSON objects.

Now I want to add a field in every JSON object according to another field in that JSON object:

Here's my response:

{
  messages: [
    {
      msgId: "2021082111010755885",
      interfaceId: 5,
      status: "QUEUED",
      createdAt: "2021-08-21 11:01:07.89554",
      modifiedAt: "2021-08-21 11:01:07.89554",
      count: 0,
    },
    {
      msgId: "2021082012204615964",
      interfaceId: 5,
      status: "QUEUED",
      createdAt: "2021-08-20 12:20:46.187297",
      modifiedAt: "2021-08-20 12:31:06.622",
      count: 5,
    },
    {
      msgId: "2021082012204575430",
      interfaceId: 5,
      status: "QUEUED",
      createdAt: "2021-08-20 12:20:46.187297",
      modifiedAt: "2021-08-20 12:27:06.473",
      count: 3,
    },
    {
      msgId: "2021082012204613152",
      interfaceId: 5,
      status: "QUEUED",
      createdAt: "2021-08-20 12:20:46.187297",
      modifiedAt: "2021-08-20 12:28:06.517",
      count: 3,
    },
  ];
}

Now I want to insert a field named mString which is status+"A" where status is from the same object.I want to insert it in every object in the above array.How can I do this?

reactjs arrays json javascript
4 Answers

Just loop though array and add

const data = {
  "messages": [
    {
      "msgId": "2021082111010755885",
      "interfaceId": 5,
      "status": "QUEUED",
      "createdAt": "2021-08-21 11:01:07.89554",
      "modifiedAt": "2021-08-21 11:01:07.89554",
      "count": 0,

    },
    {
      "msgId": "2021082012204615964",
      "interfaceId": 5,
      "status": "QUEUED",
      "createdAt": "2021-08-20 12:20:46.187297",
      "modifiedAt": "2021-08-20 12:31:06.622",
      "count": 5,

    },
    {
      "msgId": "2021082012204575430",
      "interfaceId": 5,
      "status": "QUEUED",
      "createdAt": "2021-08-20 12:20:46.187297",
      "modifiedAt": "2021-08-20 12:27:06.473",
      "count": 3,

    },
    {
      "msgId": "2021082012204613152",
      "interfaceId": 5,
      "status": "QUEUED",
      "createdAt": "2021-08-20 12:20:46.187297",
      "modifiedAt": "2021-08-20 12:28:06.517",
      "count": 3,

    }
  ]
}

data.messages.forEach((node) => node.mString = node.status + "A");

console.log(data);

user_60993270

In React I would suggest generally using an immutable update pattern where you return a new array with the element object properties you want. This uses Array.prototype.map.

const newData = {
  ...data,
  messages: data.messages.map(el => ({
    ...el,
    mString: el.status + "A",
  })),
};


const data = {
  messages: [
    {
      msgId: "2021082111010755885",
      interfaceId: 5,
      status: "QUEUED",
      createdAt: "2021-08-21 11:01:07.89554",
      modifiedAt: "2021-08-21 11:01:07.89554",
      count: 0,
    },
    {
      msgId: "2021082012204615964",
      interfaceId: 5,
      status: "QUEUED",
      createdAt: "2021-08-20 12:20:46.187297",
      modifiedAt: "2021-08-20 12:31:06.622",
      count: 5,
    },
    {
      msgId: "2021082012204575430",
      interfaceId: 5,
      status: "QUEUED",
      createdAt: "2021-08-20 12:20:46.187297",
      modifiedAt: "2021-08-20 12:27:06.473",
      count: 3,
    },
    {
      msgId: "2021082012204613152",
      interfaceId: 5,
      status: "QUEUED",
      createdAt: "2021-08-20 12:20:46.187297",
      modifiedAt: "2021-08-20 12:28:06.517",
      count: 3,
    },
  ],
};

const newData = {
  ...data,
  messages: data.messages.map(el => ({
    ...el,
    mString: el.status + "A",
  })),
};

console.log(newData);

user_86908570

I did not understand you very well in the last part but I think this is what you want

 object.messages.map(element=> {
   element.mystring=el.status + "A"
    return  element
}))

your need to access to "messages" in your JSON with dot notation

object.messages is an array you can map the objects inside (map)

user_138737520

Mutate your JSON object using forEach method. But if you have a huge JSON mutate it on BE side, instead FE or use Web Workers for this issue

const data = {
"messages": [
{
"msgId": "2021082111010755885",
"interfaceId": 5,
"status": "QUEUED",
"createdAt": "2021-08-21 11:01:07.89554",
"modifiedAt": "2021-08-21 11:01:07.89554",
"count": 0,

},
{
"msgId": "2021082012204615964",
"interfaceId": 5,
"status": "QUEUED",
"createdAt": "2021-08-20 12:20:46.187297",
"modifiedAt": "2021-08-20 12:31:06.622",
"count": 5,

},
{
"msgId": "2021082012204575430",
"interfaceId": 5,
"status": "QUEUED",
"createdAt": "2021-08-20 12:20:46.187297",
"modifiedAt": "2021-08-20 12:27:06.473",
"count": 3,

},
{
"msgId": "2021082012204613152",
"interfaceId": 5,
"status": "QUEUED",
"createdAt": "2021-08-20 12:20:46.187297",
"modifiedAt": "2021-08-20 12:28:06.517",
"count": 3,

}
]
}

data.messages.forEach(item => { item['mString'] = `${item.status} + A` });

console.log(data);
user_166972320
Related