将JSON响应转换为对象数组

Question

我检查了很多有关此的问题，但无法解决我的问题。 因此，我从API进行了get调用：

axios.get("https://ddragon.leagueoflegends.com/cdn/9.2.1/data/en_US/champion.json").then(response => {

    console.log(response.data)
    response.data.forEach(entry => {

    }) 
})

response.data有我想要的但格式很奇怪

XXX: { ... }, KKK: { ... }, JJJ: {...}

但是我需要它作为一个简单的对象数组。

由于某些原因， response.data.forEach也未定义

Answer 1

看起来您只需要字典的值，但是，您不仅需要访问响应的数据，还需要访问实际响应数据本身的“数据”。

const data = Object.values(response.data['data']);

Answer 2

对于访问密钥级别：

Object.keys(response.data).forEach(k => {
   console.log('key is', k);
   console.log('value is', response.data[k]);
});

关于它为什么不起作用的原因：您正在尝试遍历对象。 但是，常规javascript对象没有forEach原型 ，而数组则具有。

Answer 3

由于它是一个返回的对象，因此请使用Object.entries

 Object.entries(response.data).forEach(([k, v]) => console.log(k,v)); 

 <script> const response = { type: "champion", format: "standAloneComplex", version: "9.2.1", data: { Aatrox: { version: "9.2.1", id: "Aatrox", key: "266", name: "Aatrox", title: "the Darkin Blade", blurb: "Once honored defenders of Shurima against the Void, Aatrox and his brethren would eventually become an even greater threat to Runeterra, and were defeated only by cunning mortal sorcery. But after centuries of imprisonment, Aatrox was the first to find...", info: { attack: 8, defense: 4, magic: 3, difficulty: 4 }, image: { full: "Aatrox.png", sprite: "champion0.png", group: "champion", x: 0, y: 0, w: 48, h: 48 }, tags: [ "Fighter", "Tank" ], partype: "Blood Well", stats: { hp: 580, hpperlevel: 80, mp: 0, mpperlevel: 0, movespeed: 345, armor: 33, armorperlevel: 3.25, spellblock: 32.1, spellblockperlevel: 1.25, attackrange: 175, hpregen: 5, hpregenperlevel: 0.25, mpregen: 0, mpregenperlevel: 0, crit: 0, critperlevel: 0, attackdamage: 60, attackdamageperlevel: 5, attackspeedperlevel: 2.5, attackspeed: 0.651 } }, Ahri: { version: "9.2.1", id: "Ahri", key: "103", name: "Ahri", title: "the Nine-Tailed Fox", blurb: "Innately connected to the latent power of Runeterra, Ahri is a vastaya who can reshape magic into orbs of raw energy. She revels in toying with her prey by manipulating their emotions before devouring their life essence. Despite her predatory nature...", info: { attack: 3, defense: 4, magic: 8, difficulty: 5 }, image: { full: "Ahri.png", sprite: "champion0.png", group: "champion", x: 48, y: 0, w: 48, h: 48 }, tags: [ "Mage", "Assassin" ], partype: "Mana", stats: { hp: 526, hpperlevel: 92, mp: 418, mpperlevel: 25, movespeed: 330, armor: 20.88, armorperlevel: 3.5, spellblock: 30, spellblockperlevel: 0.5, attackrange: 550, hpregen: 6.5, hpregenperlevel: 0.6, mpregen: 8, mpregenperlevel: 0.8, crit: 0, critperlevel: 0, attackdamage: 53.04, attackdamageperlevel: 3, attackspeedperlevel: 2, attackspeed: 0.668 } }, Akali: { version: "9.2.1", id: "Akali", key: "84", name: "Akali", title: "the Rogue Assassin", blurb: "Abandoning the Kinkou Order and her title of the Fist of Shadow, Akali now strikes alone, ready to be the deadly weapon her people need. Though she holds onto all she learned from her master Shen, she has pledged to defend Ionia from its enemies, one...", info: { attack: 5, defense: 3, magic: 8, difficulty: 7 }, image: { full: "Akali.png", sprite: "champion0.png", group: "champion", x: 96, y: 0, w: 48, h: 48 }, tags: [ "Assassin" ], partype: "Energy", stats: { hp: 550, hpperlevel: 85, mp: 200, mpperlevel: 0, movespeed: 345, armor: 23, armorperlevel: 3.5, spellblock: 32.1, spellblockperlevel: 1.25, attackrange: 125, hpregen: 3.5, hpregenperlevel: 0.5, mpregen: 50, mpregenperlevel: 0, crit: 0, critperlevel: 0, attackdamage: 62.4, attackdamageperlevel: 3.3, attackspeedperlevel: 3.2, attackspeed: 0.625 } }, }} </script> 

Answer 4

 fetch("https://ddragon.leagueoflegends.com/cdn/9.2.1/data/en_US/champion.json") .then(response => response.json()) .then(({ data }) => { const result = []; Object.keys(data).forEach(key => { result.push(data[key]) }) console.log(result) }) 

Answer 5

另一个在保留键名的同时将对象转换为Array的对象。

FWIW我怀疑您是否想走这条路，但这是一种在保留键名的同时将对象转换为数组的方法。

 const res = {XXX: { foo: 'bar' }, KKK: {foo: 'bar' } } const arr = Object.keys(res).map(key => ({ ...res[key], key })) console.log(arr)