JavaScript对象数组filter报TypeError但控制台可正常打印值

两个核心认知误区导致你排查受阻：

1. Array.filter遍历过程中遇到异常元素直接中断，你看到的日志是遍历中断前的输出
   你贴出的测试对象里3个元素的attributes[5]确实都存在，但实际运行时result数组里存在你没注意到的异常元素：该元素的attributes数组长度不足6，索引5位置是undefined。
   遍历流程是同步执行的：前3个正常元素走到console.log时，日志内容已经进入控制台输出队列，会正常显示；遍历到第4个异常元素时，JS引擎会先对console.log的入参elem.attributes[5].value求值，此时访问undefined.value直接抛出TypeError，console.log根本没来得及执行，filter遍历直接中断。因为这段逻辑跑在Promise回调里，所以错误提示带(in promise)标识，和Promise异步特性本身无关。你看到3条正常日志就误以为所有元素都打印成功，实际上异常元素在日志打印前就触发了报错。
2. 靠固定数组索引取业务属性本身就有逻辑风险
   你默认Webpage URL永远在attributes数组索引5的位置，但从你贴的样例就能看到，后两个元素比第一个元素多了Campaign属性，只要后续接口返回调整属性顺序、新增/删除属性，索引就会直接错位，哪怕不报错也会出现过滤逻辑不符合预期的问题。

补充说明：如果你的场景里确实3个元素都能正常打印值才报错，那就是浏览器控制台懒求值的特性：当你打印引用类型值时，控制台存的是对象引用，等你手动点击展开日志时才会读取当前属性值，如果日志打印后、你展开前有其他代码修改了attributes数组把索引5的项删掉了，你展开看到的是修改后的值，但这不是你当前报错的核心原因。

不要靠固定索引匹配属性，按属性的name字段查找目标项，同时做空值兼容，从根源避免报错：

const filteredResult = testObj.result.filter(elem => {
  // 查找Webpage URL属性，找不到时给空对象做兜底，避免访问undefined报错
  const webpageUrlItem = elem.attributes.find(attr => attr.name === 'Webpage URL') ?? {}
  console.log('ELEM', webpageUrlItem.value)
  return webpageUrlItem.value === '/OP-Subscription-Center_LP-Preferred-Subscription.html'
})

如果你暂时不想改索引取值的逻辑，至少加可选链做防御性编程，避免页面直接崩溃：

const filteredResult = testObj.result.filter(elem => {
  console.log('ELEM', elem.attributes?.[5]?.value)
  return elem.attributes?.[5]?.value === '/OP-Subscription-Center_LP-Preferred-Subscription.html'
})

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