How to add Object of JSON to an API Call

Question

I have x number of Objects in an array which are created dynamically. I want to save those Object seperately by sending it through an API. Issue is there can be x number of Objects. What would be the best way to write a loop to read attribute name and its attribute value and hit the api,then read the second attribute and its values and hit the api.

So basically at one time the api will save only one object. ie

{
        "attributeName": "s1",
        "attributeValues": [
          "a",
          "b"
        ]
      }

My JSON Object looks like this:

[
  {
    "attributeName": "s1",
    "attributeValues": [
      "a",
      "b"
    ]
  },
  {
    "attributeName": "s2",
    "attributeValues": [
      "c",
      "d"
    ]
  },
  {
    "attributeName": "d1",
    "attributeValues": [
      "p",
      "q"
    ]
  },
  {
    "attributeName": "d2",
    "attributeValues": [
      "r",
      "s"
    ]
  },
  {
    "attributeName": "",
    "attributeValues": [
      ""
    ]
  },
  {
    "attributeName": "d2",
    "attributeValues": [
      "r",
      "s"
    ]
  }
]

I want to pick attribute name and its value and then send it to an API.

Alternatively say, I save the whole JSON to API,then how can I filter out individual Object if I don't know attribute name beforehand. What other approach can be there to get list of attribute names.

Answer 1

Check the frequency of data. If there is too much data on FrontEnd, then better to send in the chunk. Else can accumulate on FE and then send.

async function sendAll(data) {
  let results = [];
  for (let index = 0; index < data.length; index++) {
    const result = await axios.post('url', data[index].attributeValues);
    results.push(result);
  }
}

Sample with fake mock api.

 // function* dataLake(data) { // for (let item of data) yield item; // } const getDataFake = data => { return new Promise(r => { setTimeout(() => { r(data); }, 100); }); }; async function sendAll(data) { let results = []; for (let index = 0; index < data.length; index++) { const result = await getDataFake(data[index].attributeValues); results.push(result); } return results; } const data = [ { attributeName: "s1", attributeValues: ["a", "b"] }, { attributeName: "s2", attributeValues: ["c", "d"] }, { attributeName: "d1", attributeValues: ["p", "q"] }, { attributeName: "d2", attributeValues: ["r", "s"] }, { attributeName: "", attributeValues: [""] }, { attributeName: "d2", attributeValues: ["r", "s"] } ]; sendAll(data).then(console.log)

Answer 2

if you want json in following format

[
  {'s1':['a','b']},
  {'s2':['c','d']},
  {'d1':['p','q']},
  {'d2':['r','s']},
  {'':['']},
  {'d2':['r','s']}
]

then you can have api call for individual child, or send the entire array.

 var arr = [ { "attributeName": "s1", "attributeValues": [ "a", "b" ] }, { "attributeName": "s2", "attributeValues": [ "c", "d" ] }, { "attributeName": "d1", "attributeValues": [ "p", "q" ] }, { "attributeName": "d2", "attributeValues": [ "r", "s" ] }, { "attributeName": "", "attributeValues": [ "" ] }, { "attributeName": "d2", "attributeValues": [ "r", "s" ] } ]; var obj = arr.map((o1) => { var o = {}; o[o1.attributeName] = o1.attributeValues; return o; }); console.log(JSON.stringify(obj));