使用JavaScript中的相同键将多个json对象合并为单个对象

Question

I know looking this question might be simple, but I'm bit confused with the way of objects reacts in javascript. I tried to search as much as possible for a solution and couldn't find any.

Here, I wanted to send the below json request. (EXPECTED OUTPUT)

 {

    "request": {
        "command": "transaction",
         "commandData":{
          "type": "sale",
          "amount" : 0.00,
          "tenderType" : "credit",
          "referenceNumber": "",
          "kiosk" :{
              "machineName": "string",
              "clinicId": "string"
            }
          }
      }
}

{
    "request": {
        "command": "close",
        "commanddata":{
          }
      }
}

{
    "request": {
        "command": "status",
        "commanddata":{
         }
   }
}

For the above request, I have splitted as three json objects viz tempJson1 , tempJson2 and tempJson3 and finally combine all the json objects and store in a variable called tempJson .

But, when I try to use Object.assign() , it is taking only the tempJson3 and not merging all three json objects.

Where am I missing? Any help?

  var tempJson1 = {}; tempJson1.request = {}; tempJson1.request.command = "Transaction"; tempJson1.request.commandData = {}; tempJson1.request.commandData.type = "sale"; tempJson1.request.commandData.amount = document.getElementById("amount").value || ""; tempJson1.request.commandData.tendertype = document.getElementById("tendertype").value || ""; //tempJson.request.requireToken = document.querySelector('.consent').checked; tempJson1.request.commandData.referenceNumber = ""; tempJson1.request.kiosk = {}; tempJson1.request.kiosk.machineName = document.getElementById("machineName").value || ""; tempJson1.request.kiosk.clinicId = document.getElementById("clinicId").value || ""; var tempJson2 ={}; tempJson2.request = {}; tempJson2.request.command = "close"; tempJson2.request.commandData = {}; var tempJson3 = {}; tempJson3.request = {}; tempJson3.request.command = "status"; tempJson3.request.commandData = {}; var tempJson = Object.assign({},tempJson1,tempJson2, tempJson3); //var tempJson = tempJson1.concat(tempJson2); console.log(tempJson); console.log("tempJson = " + JSON.stringify(tempJson)); 

 <div> <input type="hidden" id="amount"/> <input type="hidden" id="tendertype"/> <input type="hidden" id="machineName"/> <input type="hidden" id="clinicId"/> </div> 

PS: Need solution with pure javascript and no ES6.

Answer 1

Ok, if I got the question right, it seems you want to send 3 blocks of data as JSON payload for an HTTP request. Blocks are:

{

    "request": {
        "command": "transaction",
         "commandData":{
            // ...
          }
      }
}

{
    "request": {
        "command": "close",
        "commandData":{
          }
      }
}

{
    "request": {
        "command": "status",
        "commandData":{
         }
   }
}

But this is not a valid JSON . You must have one entity (object or array in this case) as the root element. So I can think of these possible solutions:

1. Send 3 separated HTTP requests with one "request" JSON object in each request.

2. If you need to send all three in one request, you have to group it in some way. For example:

2.1. An array

[
  {
    "request": {
        "command": "transaction",
         "commandData":{
            // ...
          }
      }
  },
  {
    "request": {
        "command": "close",
        "commandData":{
          }
      }
  },
  {
    "request": {
        "command": "status",
        "commandData":{
         }
   }
  } 
]

// so the code would be:
var tempJson = [tempJson1, tempJson2, tempJson3];

2.2. An object with differently named properties:

{
  "transaction": {
    "request": {
        "command": "transaction",
         "commandData":{
            // ...
          }
      }
  },
  "close": {
    "request": {
        "command": "close",
        "commandData":{
          }
      }
  },
  "status": {
    "request": {
        "command": "status",
        "commandData":{
         }
   }
  } 
}

// so the code would be:
var tempJson = {
  transaction: tempJson1, 
  close: tempJson2, 
  status: tempJson3
};

2.3. Or some kind of a combination of those.

Answer 2

您不能在一个对象中一次又一次拥有相同的键。“ request”键在同一对象内三次使用。因此它将替换前两个对象。