如何修复JavaScript中嵌套取值时类型never[]的属性不存在报错？

报错原因分析 #

这两个报错都是类型推断不匹配+逻辑错误导致的：

1. 你在first_main_2的三元判断里，把不存在的情况赋值成了[]（数组），但实际上main_2的元素是带有id和data属性的对象。TypeScript会推断first_main_2的类型是never[] | { id: string; data: Array<{id: string; version: string}> }，当它是数组的时候，自然没有data属性，所以触发第一个报错。
2. 第二个报错是双重问题：一是data可能为undefined，二是你写的item.id === data.id逻辑错误——data是数组，根本没有id属性，TypeScript自然会提示找不到这个属性。

修复方案 #

我会从类型定义、简化判断逻辑、修正业务逻辑三个方面来修复：

1. 先定义数据结构的类型（让TypeScript明确每个结构的类型）

// 定义最内层的data元素类型
interface ItemVersion {
  id: string;
  version: string;
}

// 定义main_2的元素类型
interface Main2Item {
  id: string;
  data: ItemVersion[];
}

// 定义main_1的元素类型
interface Main1Item {
  id: string;
  main_2: Main2Item[];
}

// 定义main的类型
interface MainData {
  id: string;
  main_1: Main1Item[];
}

2. 用可选链+空值合并简化判断，避免错误的类型赋值

把原来的三元判断里的[]换成undefined，同时用可选链（?.）简化冗长的&&判断，让TypeScript的类型推断更准确：

function Parent() {
  // 给main加上类型，明确它可能为undefined
  const main = get(data, 'main') as MainData | undefined;
  
  // 用可选链直接逐层获取目标对象，不存在则返回undefined
  const targetMain2Item = main?.main_1?.[0]?.main_2?.[0];
  const targetDataList = targetMain2Item?.data;

  // 修正find逻辑：根据示例你要找的是id为'1'的元素，可按需调整
  const versionItem = targetDataList?.find((item: ItemVersion) => item.id === '1') || {};

  return (
    <span>{getSomeFunction(versionItem.version)}</span>
  );
}

额外说明

• 为什么把[]换成undefined？因为main_2的元素是对象，不是数组，用undefined表示“不存在”更符合实际场景，TypeScript也能正确推断类型。
• 可选链操作符?.会在访问属性前检查前面的值是否为null/undefined，如果是就直接返回undefined，避免了冗长的&&判断，代码更简洁。
• 你原来的item.id === data.id是逻辑错误，我改成了匹配id === '1'的元素，如果你有其他匹配规则，可以自行调整。

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