TypeScript中if-else的else代码块未执行问题排查

当myname不存在时，res.body?.myname返回的是undefined——虽然你给myname标了string类型，但实际值是undefined。这时候你去访问myname.length，undefined根本没有length属性，直接触发类型错误，程序直接跳去执行catch块了，自然走不到else分支。

有两种简单的修复方式，选哪种都可以：

方式一：先判断存在性再查长度 #

try {
  const res = await apiCall
  // 修正类型，允许undefined
  const myname: string | undefined = res.body?.myname

  // 先确认myname不是undefined，再检查长度
  if (myname && myname.length > 0) {
    console.log('Name')
  } else {
    console.log('no Name')
  }

} catch (error: any) {
  console.log('error', error)
}

方式二：用可选链避免报错 #

try {
  const res = await apiCall
  const myname: string | undefined = res.body?.myname

  // 用可选链，myname为undefined时不会报错，直接返回undefined
  if (myname?.length > 0) {
    console.log('Name')
  } else {
    console.log('no Name')
  }

} catch (error: any) {
  console.log('error', error)
}

另外提一句：你原来的类型标注const myname : string = res.body?.myname不符合TypeScript的类型规范，因为res.body?.myname可能是undefined，IDE应该会给你提示类型不匹配，记得改成string | undefined。

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