TypeScript中如何获取嵌套可选对象值、设置默认值并定义类型

你写的第二种嵌套解构写法不能正常运行，核心问题有两个：

• 你定义的Session类型里data是必填属性，但实际useSession()返回的data本身就可能是null/undefined，类型定义和实际返回值不匹配
• 解构时如果父级属性是null/undefined，直接访问子属性会直接抛出运行时错误，你只给roles设了默认值，根本拦不住父级为空时的报错——默认值仅在当前属性严格等于undefined时生效，无法处理父级不存在的场景。

你最开始写的三段式写法逻辑是对的，只是可以简化，不需要冗余的中间判断：

推荐写法（最简洁易读） #

直接用可选链+空值合并运算符即可，同时满足类型要求：

const { data } = useSession()
// 需要单独使用user变量的场景
const user: any = data?.user ?? {}
const roles = user.roles ?? []

// 不需要单独用user的话可以直接一行取到roles
// const roles = data?.user?.roles ?? []

这里用??（空值合并运算符）代替||是更严谨的选择：||会把所有假值（比如0、空字符串）都替换成默认值，??只会在属性是null/undefined时才生效，虽然在roles是数组的场景下两者效果一致，但属于更规范的写法。

解构写法的正确打开方式 #

如果你坚持要用嵌套解构，必须给每一层可能为空的父级都设置默认空值，才能避免运行时报错：

type Session = {
  data?: { // 补上data的可选标记，匹配实际返回情况
    user?: {
      roles?: string[]
    }
  }
}

const {
  data: {
    user: { roles = [] } = {} // 给user层级设置默认空对象
  } = {} // 给data层级设置默认空对象
}: Session = useSession()

这种写法需要给每层都补默认值，冗余度高、可读性差，日常开发更推荐前面的可选链写法。

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