如何在Javascript中重构嵌套的JSON对象

Question

我使用Javascript以这种格式获取JSON：

[{
    "data": {
        "serialNumber": "12345678",
        "loopCount": 2,
        "temperature3": 22.74921781259558,
        "temperature2": 21.459065450414467,
        "temperature1": 25.60573959350586,
        "temperature7": 20.560272859443444,
        "temperature6": 24.672770566493245,
        "temperature5": 21.418451432003607,
        "temperature4": 24.136719323883636,
        "temperature8": 23.106006457744044
    },
    "deviceID": "12345678",
    "timestamp": "1514876959940"
}, {
    "data": {
        "loopCount": 3008,
        "serialNumber": "12345678",
        "temperature3": 24.340541769172475,
        "temperature2": 24.592980449259386,
        "temperature1": 25.208276748657227,
        "temperature7": 22.95620713734396,
        "temperature6": 24.173083663793975,
        "temperature5": 22.274865355495226,
        "temperature4": 23.507075904805543,
        "temperature8": 20.596809083024773
    },
    "deviceID": "12345678",
    "timestamp": "1514910791413"
}]

我想重构JSON对象使用Javascript看起来像这样：

[{
    "loopCount": 3009,
    "serialNumber": "12345678",
    "temperature3": 20.938793894509594,
    "temperature2": 20.631314982104072,
    "temperature1": 25.192977905273438,
    "temperature7": 21.514532309261064,
    "temperature6": 24.03336173424463,
    "temperature5": 23.453609565992643,
    "temperature4": 24.424291668247513,
    "temperature8": 22.044323519108403,
    "timestamp": "1514910802296"
}, {
    "loopCount": 3009,
    "serialNumber": "12345678",
    "temperature3": 20.938793894509594,
    "temperature2": 20.631314982104072,
    "temperature1": 25.192977905273438,
    "temperature7": 21.514532309261064,
    "temperature6": 24.03336173424463,
    "temperature5": 23.453609565992643,
    "temperature4": 24.424291668247513,
    "temperature8": 22.044323519108403,
    "timestamp": "1514910802296"
}]

目前，这就是我所拥有的：

  var myObj =[{
	"data": {
		"serialNumber": "12345678",
		"loopCount": 2,
		"temperature3": 22.74921781259558,
		"temperature2": 21.459065450414467,
		"temperature1": 25.60573959350586,
		"temperature7": 20.560272859443444,
		"temperature6": 24.672770566493245,
		"temperature5": 21.418451432003607,
		"temperature4": 24.136719323883636,
		"temperature8": 23.106006457744044
	},
	"deviceID": "12345678",
	"timestamp": "1514876959940"
},  {
	"data": {
		"loopCount": 3008,
		"serialNumber": "12345678",
		"temperature3": 24.340541769172475,
		"temperature2": 24.592980449259386,
		"temperature1": 25.208276748657227,
		"temperature7": 22.95620713734396,
		"temperature6": 24.173083663793975,
		"temperature5": 22.274865355495226,
		"temperature4": 23.507075904805543,
		"temperature8": 20.596809083024773
	},
	"deviceID": "12345678",
	"timestamp": "1514910791413"
}, {
	"data": {
		"loopCount": 3009,
		"serialNumber": "12345678",
		"temperature3": 20.938793894509594,
		"temperature2": 20.631314982104072,
		"temperature1": 25.192977905273438,
		"temperature7": 21.514532309261064,
		"temperature6": 24.03336173424463,
		"temperature5": 23.453609565992643,
		"temperature4": 24.424291668247513,
		"temperature8": 22.044323519108403
	},
	"deviceID": "12345678",
	"timestamp": "1514910802296"
},  {
	"data": {
		"loopCount": 3462,
		"serialNumber": "12345678",
		"temperature3": 20.927366751292798,
		"temperature2": 23.690258459678994,
		"temperature1": 24.851139068603516,
		"temperature7": 22.797037129771063,
		"temperature6": 24.46046332152272,
		"temperature5": 24.415112076761666,
		"temperature4": 21.217672372617155,
		"temperature8": 20.609864963787967
	},
	"deviceID": "12345678",
	"timestamp": "1514915728668"
}]





for (var key in myObj) {
	//document.getElementById("demo").innerHTML += myObj.length + "<br>";
	document.getElementById("demo").innerHTML += myObj[key].data.serialNumber + "<br>";
	document.getElementById("demo").innerHTML += myObj[key].data.loopCount + "<br>";
	document.getElementById("demo").innerHTML += myObj[key].timestamp + "<br>";
	document.getElementById("demo").innerHTML += myObj[key].data.temperature1 + "<br>";
	document.getElementById("demo").innerHTML += myObj[key].data.temperature2 + "<br>";
	document.getElementById("demo").innerHTML += myObj[key].data.temperature3 + "<br>";
	document.getElementById("demo").innerHTML += myObj[key].data.temperature4 + "<br>";
	document.getElementById("demo").innerHTML += myObj[key].data.temperature5 + "<br>";
	document.getElementById("demo").innerHTML += myObj[key].data.temperature6 + "<br>";
	document.getElementById("demo").innerHTML += myObj[key].data.temperature7 + "<br>";
	document.getElementById("demo").innerHTML += myObj[key].data.temperature8 + "<br> <br>";
}

<!DOCTYPE html>
<html>
<body>

<p>How to access nested JSON objects.</p>

<p id="demo"></p>


</body>
</html>

Answer 1

使用ES7，您可以使用地图和传播：

data.map(x => ({ ...x.data, timestamp: x.timestamp }))

ES6没有传播：

data.map(x => Object.assign({}, x.data, { timestamp: x.timestamp }))

Answer 2

  

我想重构JSON对象使用Javascript看起来像这样。

您可以使用map功能。

＆＃13;

＆＃13;

var array = [{    "data": {        "serialNumber": "12345678",        "loopCount": 2,        "temperature3": 22.74921781259558,        "temperature2": 21.459065450414467,        "temperature1": 25.60573959350586,        "temperature7": 20.560272859443444,        "temperature6": 24.672770566493245,        "temperature5": 21.418451432003607,        "temperature4": 24.136719323883636,        "temperature8": 23.106006457744044    },    "deviceID": "12345678",    "timestamp": "1514876959940"}, {    "data": {        "loopCount": 3008,        "serialNumber": "12345678",        "temperature3": 24.340541769172475,        "temperature2": 24.592980449259386,        "temperature1": 25.208276748657227,        "temperature7": 22.95620713734396,        "temperature6": 24.173083663793975,        "temperature5": 22.274865355495226,        "temperature4": 23.507075904805543,        "temperature8": 20.596809083024773    },    "deviceID": "12345678",    "timestamp": "1514910791413"}];

var result = array.map((o) => ({...o.data, timestamp: o.timestamp}));
console.log(result);

＆＃13;

.as-console-wrapper { max-height: 100% !important; top: 0; }

＆＃13;

＆＃13;

＆＃13;