如何访问嵌套JSON数组？使用forEach获取singleLine.text遇问题求助

嘿，问题很明确——你的数组第一个元素是boxedCharacters对象，根本没有singleLine属性，直接访问value.singleLine.text自然会抛出Cannot read properties of undefined (reading 'text')的错误。下面给你几种可行的解决方法：

方法1：遍历前先判断属性是否存在 #

在forEach的回调里先检查当前元素是否包含singleLine属性，再访问text：

var a = [ { boxedCharacters: { text: '１０４００４３' } }, { singleLine: { text: '東京都中央区日本橋新古町' } }, { singleLine: { text: 'この度は、数多くのお店の中から当店を'} }, { singleLine: { text: 'お選びご来店頂きまして誠にありがとう'} } ]
a.forEach(function(value){
  if (value.singleLine) {
    console.log(value.singleLine.text)
  }
})

这种方法兼容性最好，适合所有JavaScript运行环境。

方法2：先过滤出目标元素再遍历 #

先用filter方法筛选出所有包含singleLine的元素，再对筛选后的数组执行遍历操作：

var a = [ { boxedCharacters: { text: '１０４００４３' } }, { singleLine: { text: '東京都中央区日本橋新古町' } }, { singleLine: { text: 'この度は、数多くのお店の中から当店を'} }, { singleLine: { text: 'お選びご来店頂きまして誠にありがとう'} } ]
const targetItems = a.filter(item => item.singleLine);
targetItems.forEach(function(value){
  console.log(value.singleLine.text)
})

如果后续还需要用到这些包含singleLine的元素，这种方法会更高效，因为筛选结果可以复用。

方法3：使用可选链操作符（ES2020+） #

如果你使用的是现代浏览器或Node.js 14+环境，可以用可选链?.简化代码，它会在属性不存在时自动返回undefined，避免报错：

var a = [ { boxedCharacters: { text: '１０４００４３' } }, { singleLine: { text: '東京都中央区日本橋新古町' } }, { singleLine: { text: 'この度は、数多くのお店の中から当店を'} }, { singleLine: { text: 'お選びご来店頂きまして誠にありがとう'} } ]
a.forEach(function(value){
  const text = value.singleLine?.text;
  if (text) {
    console.log(text)
  }
})

这种写法最简洁，代码可读性也很高。

内容的提问来源于stack exchange，提问作者Max