TypeScript中members.map偶发undefined报错如何添加正确校验

崩溃是因为函数调用时members入参可能为undefined或null，直接调用map方法触发报错。你第一次修改存在两个问题：

• 入参类型声明为Person[]，但实际调用场景下可能传入undefined，类型定义和实际输入不匹配
• 为member的属性添加可选链后，若存在非法的member项，会生成undefined undefined这类无效选项，不符合业务预期，也是单元测试未通过的常见原因

基础修复（兼容undefined/null输入，避免崩溃） #

调整入参类型，提前做数组合法性校验，非法输入直接返回空数组，同时简化代码逻辑：

export const memberDropdownOptions = (members?: Person[] | null): Option[] => {
  // 非数组输入统一返回空数组，彻底避免调用map报错
  if (!Array.isArray(members)) return []
  return members.map((member: Person) => ({
    label: `${member.firstName} ${member.lastName}`,
    value: member.dependentNumber,
  }))
}

进阶修复（同时过滤非法成员项） #

如果你的数据源可能存在空的、不合法的member对象，可以额外增加过滤逻辑，避免生成无效选项：

export const memberDropdownOptions = (members?: Person[] | null): Option[] => {
  if (!Array.isArray(members)) return []
  return members
    // 过滤掉缺少必要属性的非法成员
    .filter(member => !!member?.firstName && !!member?.lastName && !!member?.dependentNumber)
    .map(member => ({
      label: `${member.firstName} ${member.lastName}`,
      value: member.dependentNumber,
    }))
}

以上修改完全覆盖了members为undefined/null/非数组的异常场景，同时逻辑符合常规业务预期，可通过对应的单元测试。

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