处理需要嵌套循环的后端数据

很久没写博客，最近和朋友聊天发现他一直有写博客的习惯，想起自己之前也坚持了一段时间，后来不知咋的就没写了。。。想想平常遇到的很多问题很多都是重复的，多写博客多总结让知识更系统，总结经常遇到的问题也能提高开发效率。话不多说开始

最近遇到一需求，需要将后端数据做成echarts，一般将后端数据循环遍历一次就能得到xy轴数据，这次后端返回的数据需要多次循环，如下图：

需求图：

后端数据：
“result”: [{
“landChar”: “all”,
“cantonCityName”: “深圳市”,
“yearMonth”: “2020-01”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 390,
“resulCount”: 1,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “440300”,
“areaSum”: 2423
}, {
“landChar”: “all”,
“cantonCityName”: “广州市”,
“yearMonth”: “2020-01”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 3439,
“resulCount”: 4,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “440100”,
“areaSum”: 331818.43
}, {
“landChar”: “all”,
“cantonCityName”: “珠海市”,
“yearMonth”: “2020-01”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 1576,
“resulCount”: 4,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “440400”,
“areaSum”: 3200
}, {
“landChar”: “all”,
“cantonCityName”: “汕头市”,
“yearMonth”: “2020-01”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 1138,
“resulCount”: 3,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “440500”,
“areaSum”: 24432
}, {
“landChar”: “all”,
“cantonCityName”: “韶关市”,
“yearMonth”: “2020-01”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 222,
“resulCount”: 1,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “440200”,
“areaSum”: 2331
}, {
“landChar”: “all”,
“cantonCityName”: “湛江市”,
“yearMonth”: “2020-01”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 321,
“resulCount”: 1,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “440800”,
“areaSum”: 1000
}, {
“landChar”: “all”,
“cantonCityName”: “河源市”,
“yearMonth”: “2020-01”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 321,
“resulCount”: 1,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “441600”,
“areaSum”: 200
}, {
“landChar”: “all”,
“cantonCityName”: “深圳市”,
“yearMonth”: “2020-02”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 826,
“resulCount”: 2,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “440300”,
“areaSum”: 2100
}, {
“landChar”: “all”,
“cantonCityName”: “江门市”,
“yearMonth”: “2020-02”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 56.9,
“resulCount”: 1,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “440700”,
“areaSum”: 1000
}, {
“landChar”: “all”,
“cantonCityName”: “佛山市”,
“yearMonth”: “2020-02”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 1122,
“resulCount”: 3,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “440600”,
“areaSum”: 7446
}, {
“landChar”: “all”,
“cantonCityName”: “韶关市”,
“yearMonth”: “2020-02”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 462,
“resulCount”: 2,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “440200”,
“areaSum”: 1080
}, {
“landChar”: “all”,
“cantonCityName”: “深圳市”,
“yearMonth”: “2020-03”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 561,
“resulCount”: 1,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “440300”,
“areaSum”: 1000
}, {
“landChar”: “all”,
“cantonCityName”: “江门市”,
“yearMonth”: “2020-03”,
“firstClassUse”: “all”,
“circulation”: “all”,
“secondClassUse”: “all”,
“transPrice”: 23.4,
“resulCount”: 1,
“cantonProvince”: “440000”,
“cantonProvinceName”: “广东省”,
“cantonCity”: “440700”,
“areaSum”: 6523
}]

需要处理成的数据格式：
yData: [
{ name: ‘广州市’, data: [53, 56, 76, 10, 11, 30, 20, 21, 76, 54, 76, 13] },
{ name: ‘深圳市’, data: [47, 88, 13, 22, 35, 19, 11, 30, 53, 22, 52, 29] },
{ name: ‘珠海市’, data: [61, 48, 13, 12, 45, 49, 21, 40, 43, 32, 42, 49] },
{ name: ‘佛山市’, data: [31, 88, 13, 42, 35, 69, 11, 30, 33, 22, 72, 59] },
{ name: ‘汕头市’, data: [81, 28, 13, 22, 45, 79, 21, 20, 43, 22, 12, 49] },
{ name: ‘韶关市’, data: [91, 48, 13, 52, 75, 89, 11, 30, 23, 12, 62, 39] },
{ name: ‘河源市’, data: [11, 18, 13, 32, 95, 29, 41, 40, 43, 22, 72, 19] },
{ name: ‘梅州市’, data: [31, 48, 13, 52, 85, 29, 31, 50, 33, 32, 72, 29] },
{ name: ‘惠州市’, data: [51, 68, 13, 62, 85, 29, 71, 60, 83, 32, 72, 29] },
{ name: ‘汕尾市’, data: [71, 88, 13, 82, 85, 29, 71, 10, 83, 32, 72, 29] },
{ name: ‘东莞市’, data: [81, 88, 13, 22, 85, 29, 71, 10, 83, 32, 72, 29] },
{ name: ‘中山市’, data: [81, 48, 13, 42, 85, 29, 71, 10, 83, 32, 72, 29] },
{ name: ‘江门市’, data: [31, 48, 13, 52, 85, 29, 71, 10, 83, 32, 72, 29] },
{ name: ‘阳江市’, data: [91, 48, 13, 72, 85, 29, 71, 10, 83, 32, 72, 29] },
{ name: ‘湛江市’, data: [21, 48, 13, 2, 85, 29, 71, 10, 83, 32, 72, 29] },
{ name: ‘茂名市’, data: [41, 48, 13, 842, 85, 29, 71, 10, 83, 32, 72, 29] },
{ name: ‘肇庆市’, data: [11, 48, 13, 42, 85, 29, 71, 10, 83, 32, 72, 29] },
{ name: ‘清远市’, data: [51, 48, 13, 42, 85, 29, 71, 10, 83, 32, 72, 29] },
{ name: ‘潮州市’, data: [71, 48, 13, 42, 85, 29, 71, 10, 83, 32, 72, 29] },
{ name: ‘揭阳市’, data: [91, 48, 13, 42, 85, 29, 71, 10, 83, 32, 72, 29] },
{ name: ‘云浮市’, data: [21, 48, 13, 42, 85, 29, 71, 10, 83, 32, 72, 29] }
]

以下是前端处理方法：
var cityArr = [];
var dateArr=[];
for(var i in data.result){
if(data.result[i][“cantonCityName”] && data.result[i][“cantonCityName”]!=""){
if(!cityArr.includes(data.result[i][“cantonCityName”])){
cityArr.push(data.result[i][“cantonCityName”])
}
if(data.result[i][“yearMonth”] && !dateArr.includes(data.result[i][“yearMonth”])){
dateArr.push(data.result[i][“yearMonth”])
}
}
}
console.log(data.result)
console.log(cityArr)
console.log(dateArr)
var AllArr={};
for(var j in cityArr){
var tempcity=[];
for(var k in dateArr){
var temp = 0;
for(var i in data.result){
if(data.result[i][“cantonCityName”] && data.result[i][“cantonCityName”]!=""){
if(data.result[i][“cantonCityName”]==cityArr[j] && data.result[i][“yearMonth”]dateArr[k]){
tempcity.push(data.result[i][“transPrice”]);
temp = 1;
}
}
}
if(temp0){
tempcity.push(null);
}
}
AllArr[cityArr[j]] = tempcity
}
console.log(AllArr)