Question

我检查了很多有关此的问题，但无法为我的案子解决。因此，我通过API进行了调用：

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)

将JSON响应转换为对象数组

5 个答案: