访问嵌套数组对象的total_state_changes遇TypeError，求解决

问题场景 #

尝试读取API响应中嵌套数组内的total_state_changes字段，API响应结构如下：

{
  "sis_imports": [
    {
      "id": 5130,
      "created_at": "2023-08-21T18:02:22Z",
      "started_at": "2023-08-21T18:02:25Z",
      "ended_at": "2023-08-21T18:02:26Z",
      "updated_at": "2023-08-21T18:02:27Z",
      "progress": 100,
      "workflow_state": "imported_with_messages",
      "data": {
        "import_type": "instructure_csv",
        "downloadable_attachment_ids": [954469],
        "supplied_batches": ["account"],
        "counts": {
          "change_sis_ids": 0,
          "accounts": 1,
          "terms": 0,
          "abstract_courses": 0,
          "courses": 0,
          "sections": 0,
          "xlists": 0,
          "users": 0,
          "logins": 0,
          "enrollments": 0,
          "admins": 0,
          "group_categories": 0,
          "groups": 0,
          "group_memberships": 0,
          "grade_publishing_results": 0,
          "user_observers": 0,
          "error_count": 0,
          "warning_count": 3
        },
        "running_immediately": true,
        "completed_importers": ["account"],
        "statistics": {
          "total_state_changes": 1
        }
      }
    }
  ]
}

编写的映射代码运行时抛出错误：TypeError: Cannot read properties of undefined (reading 'statistics')

var statechange = data.sis_imports["data"]["statistics"].map (({
    total_state_changes
}) => [total_state_changes]);

错误原因 #

1. sis_imports是数组类型，不能直接通过sis_imports["data"]访问内部字段，必须先遍历数组元素或通过索引定位具体项
2. 链式访问时未做空值保护，若数组为空、元素缺失或字段不存在，会直接触发异常

修复方案 #

方案1：提取所有sis_imports项的total_state_changes #

如果需要获取数组中所有项的目标字段：

// 遍历数组，用可选链操作符做空值保护，避免报错
var statechange = data.sis_imports.map(item => {
    return item?.data?.statistics?.total_state_changes;
}).filter(Boolean); // 可选：过滤掉字段不存在的项

方案2：获取单个sis_imports项的字段 #

如果只需要数组中第一个（或指定索引）项的目标字段：

// 定位第一个数组元素，带空值保护
var firstStateChange = data.sis_imports[0]?.data?.statistics?.total_state_changes;

关键说明 #

• 使用可选链操作符?.：当链式访问的某一层级为null或undefined时，表达式会短路返回undefined，避免抛出错误
• 明确数组结构：sis_imports是数组，必须先处理数组元素，再访问元素内部的data等嵌套字段

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