javascript - 复杂的 JSON 结构与 JS

Question

我正在寻找一种从 JSON 数据生成 HTML 表格的方法。

因为我们使用 CMS，所以我的工具选项有限，所以我只能使用 JS、JQuery 和 ApacheVelocity(不制作新模板，只使用“语法”)。

好吧，我从远程 API 获得了这种 JSON 数据:

{
    "code": 0,
    "rid": "0",
    "data": {
        "subid": "-7766883411351472375",
        "data": {
            "region": {
                "123": {
                    "alias": "Europe",
                    "game": {
                        "11811809": {
                            "id": 11811809,
                            "team1_name": "Zorya Luhansk",
                            "team2_name": "SC Braga",
                            "market": {
                                "188597332": {
                                    "type": "P1XP2",
                                    "name": "Ganador del Partido",
                                    "event": {
                                        "624566458": {
                                            "price": 2.39,
                                            "name": "W1"
                                        },
                                        "624566459": {
                                            "price": 3.01,
                                            "name": "X"
                                        },
                                        "624566460": {
                                            "price": 2.82,
                                            "name": "W2"
                                        }
                                    }
                                }
                            }
                        },
                        "11811810": {
                            "id": 11811810,
                            "team1_name": "Olympiacos Piraeus",
                            "team2_name": "FC Luzern",
                            "market": {
                                "188597340": {
                                    "type": "P1XP2",
                                    "name": "Ganador del Partido",
                                    "event": {
                                        "624566476": {
                                            "price": 1.34,
                                            "name": "W1"
                                        },
                                        "624566477": {
                                            "price": 4.29,
                                            "name": "X"
                                        },
                                        "624566478": {
                                            "price": 7.92,
                                            "name": "W2"
                                        }
                                    }
                                }
                            }
                        },
                        "11844220": {
                            "id": 11844220,
                            "team1_name": "NK Domzale",
                            "team2_name": "FC Ufa",
                            "market": {
                                "189338624": {
                                    "type": "P1XP2",
                                    "name": "Ganador del Partido",
                                    "event": {
                                        "626913821": {
                                            "price": 2.35,
                                            "name": "W1"
                                        },
                                        "626913822": {
                                            "price": 2.86,
                                            "name": "X"
                                        },
                                        "626913823": {
                                            "price": 3.03,
                                            "name": "W2"
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

我面临的第一个问题是那些数字索引。引用这个的唯一方法是这样的:

arr_from_json.data.data.region[123].game[11844220].team1_name

如果我们只提取几个“游戏”也没关系，即使是 100 个游戏。但要让成千上万的游戏不断更新是不可能的。

有什么方法可以迭代这个丑陋的 JSON 结构吗？

非常感谢

---

编辑:

我想创建一个包含不同游戏的表格:

Zorya Luhansk - SC Braga
    W1       X       W2
    2.39     3.01    2.82

对我来说最重要的数据/关键是:团队名称、可能结果的名称和价格。

Answer 1

您可以使用辅助函数将这些索引对象转换为传统数组，然后在转换后以更自然的方式迭代数据。请参阅下面的示例，了解使用 Array.map 和助手 function keysToArray(obj){ return Object.keys(obj).map(key => obj[key]); }

const resp = {
    "code": 0,
    "rid": "0",
    "data": {
        "subid": "-7766883411351472375",
        "data": {
            "region": {
                "123": {
                    "alias": "Europe",
                    "game": {
                        "11811809": {
                            "id": 11811809,
                            "team1_name": "Zorya Luhansk",
                            "team2_name": "SC Braga",
                            "market": {
                                "188597332": {
                                    "type": "P1XP2",
                                    "name": "Ganador del Partido",
                                    "event": {
                                        "624566458": {
                                            "price": 2.39,
                                            "name": "W1"
                                        },
                                        "624566459": {
                                            "price": 3.01,
                                            "name": "X"
                                        },
                                        "624566460": {
                                            "price": 2.82,
                                            "name": "W2"
                                        }
                                    }
                                }
                            }
                        },
                        "11811810": {
                            "id": 11811810,
                            "team1_name": "Olympiacos Piraeus",
                            "team2_name": "FC Luzern",
                            "market": {
                                "188597340": {
                                    "type": "P1XP2",
                                    "name": "Ganador del Partido",
                                    "event": {
                                        "624566476": {
                                            "price": 1.34,
                                            "name": "W1"
                                        },
                                        "624566477": {
                                            "price": 4.29,
                                            "name": "X"
                                        },
                                        "624566478": {
                                            "price": 7.92,
                                            "name": "W2"
                                        }
                                    }
                                }
                            }
                        },
                        "11844220": {
                            "id": 11844220,
                            "team1_name": "NK Domzale",
                            "team2_name": "FC Ufa",
                            "market": {
                                "189338624": {
                                    "type": "P1XP2",
                                    "name": "Ganador del Partido",
                                    "event": {
                                        "626913821": {
                                            "price": 2.35,
                                            "name": "W1"
                                        },
                                        "626913822": {
                                            "price": 2.86,
                                            "name": "X"
                                        },
                                        "626913823": {
                                            "price": 3.03,
                                            "name": "W2"
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

function keysToArray(obj){ return Object.keys(obj).map(key => obj[key]); }

function parseGameData(data){
  return keysToArray(data.region).map(obj => keysToArray(obj.game).map(obj => {
        obj.market = keysToArray(obj.market).map(obj => {
          return {
            name: obj.name,
            event: keysToArray(obj.event)
          }
        })
        return obj
      }))
}

console.log(parseGameData(resp.data.data))