JS打印对象属性有值仍报species读取TypeError排查
问题根因
两个低级错误导致的越界访问:
- 索引路径写混+变量名冲突
你内层处理多分支的循环,遍历目标是二阶进化节点下的evolves_to数组(比如奇鲁莉安节点下的沙奈朵、艾路雷朵两个三阶分支),但循环内部所有属性读取都错写成了访问顶层一阶数组data.evolves_to[i],完全没进到二阶节点的数组里。
加上内外循环都用i当迭代变量,非常容易写混路径:奇鲁莉安的场景下,一阶数组data.evolves_to长度只有1(仅奇鲁莉安一个节点),内层循环i=0时刚好能读到一阶数组下标0的奇鲁莉安数据,console能正常输出名称;i=1时data.evolves_to[1]是undefined,读取.species直接抛错,这就是你看到“输出完名称才崩溃”的原因。 - 分支判断写死下标
你写的判断条件if (data.evolves_to[0].evolves_to.length > 1)硬编码了一阶数组下标0,既覆盖不到伊布这种一阶就有多分支的场景,也没法处理多个一阶节点各自带分支的情况。
修复方案
把进化链遍历的逻辑替换成下面的代码,核心是把每一层的节点存成单独变量避免路径写错,内外循环用不同的迭代变量名,遍历哪个数组就从哪个节点往下取值:
const json = await axios(rawData[1].evolution_chain.url); const chain = json.data.chain; for (let i = 0; i < chain.evolves_to.length; i++) { const firstEvo = chain.evolves_to[i]; const hasMultiBranch = firstEvo.evolves_to.length > 1; const noNextEvo = firstEvo.evolves_to.length === 0; // 推入基础进化链条目 pokemon.evolutions.push({ first: chain.species.name, second: { name: firstEvo.species.name, mode: { name: firstEvo.evolution_details[0].trigger.name, gender: firstEvo.evolution_details[0].gender, level: firstEvo.evolution_details[0].min_level, item: firstEvo.evolution_details[0].item?.name || null, happiness: firstEvo.evolution_details[0].min_happiness, move: firstEvo.evolution_details[0].known_move, }, }, third: noNextEvo ? null : { name: firstEvo.evolves_to[0].species.name, mode: { name: firstEvo.evolves_to[0].evolution_details[0].trigger.name, gender: firstEvo.evolves_to[0].evolution_details[0].gender, level: firstEvo.evolves_to[0].evolution_details[0].min_level, item: firstEvo.evolves_to[0].evolution_details[0].item?.name || null, happiness: firstEvo.evolves_to[0].evolution_details[0].min_happiness, move: firstEvo.evolves_to[0].evolution_details[0].known_move, }, }, }); // 处理当前一阶节点下的多分支三阶进化 if (hasMultiBranch) { for (let j = 0; j < firstEvo.evolves_to.length; j++) { const branchEv = firstEvo.evolves_to[j]; pokemon.evolutions.push({ first: chain.species.name, second: { name: firstEvo.species.name, mode: { name: firstEvo.evolution_details[0].trigger.name, gender: firstEvo.evolution_details[0].gender, level: firstEvo.evolution_details[0].min_level, item: firstEvo.evolution_details[0].item?.name || null, happiness: firstEvo.evolution_details[0].min_happiness, move: firstEvo.evolution_details[0].known_move, }, }, third: { name: branchEv.species.name, mode: { name: branchEv.evolution_details[0].trigger.name, gender: branchEv.evolution_details[0].gender, level: branchEv.evolution_details[0].min_level, item: branchEv.evolution_details[0].item?.name || null, happiness: branchEv.evolution_details[0].min_happiness, move: branchEv.evolution_details[0].known_move, }, }, }); } } }
- 额外容错提示:PokeAPI里部分特殊宝可梦的
evolution_details可能为空数组,直接取[0]会触发同类undefined错误,建议给所有层级的属性访问加上可选链?.做兜底,比如firstEv.evolution_details?.[0]?.trigger?.name。
内容的提问来源于stack exchange,提问作者clapmemereview
相关产品推荐
相关产品推荐

