地图功能中的空/未定义检查

Question

我有一个由函数填充的小角度材料表

this.dataSource.data = data.data.map(item => ({
    id: item._id,
    ticketId: item.key,
    summary: item.fields.summary,
    priority: item.fields.priority.name,
    createdAt: item.fields.created,
    createdBy: item.fields.reporter.emailAddress,
    state: item.fields.status.name
}));

但在我的某些元素中，item.fields.priority.name 或 item.fields.status.name 为空/未定义。是否有可能检查这一点，而不仅仅是写某事。像“未定义”？我试过? item.fields.status.name : 'not defined'，但我还是得到了

ERROR TypeError: Cannot read property 'name' of null

Answer 1

您可以使用?. 和?? 运算符：

priority: item.fields.priority?.name ?? 'this is undefined'

或者为什么不直接使用undefined：

priority: item.fields.priority?.name

Answer 2

这应该可以正常工作

this.dataSource.data = data.data.map((item) => ({
  id: item._id,
  ticketId: item.key,
  summary: item.fields?.summary ?? "not defined",
  priority: item.fields?.priority?.name ?? "not defined",
  createdAt: item.fields?.created ?? "not defined",
  createdBy: item.fields?.reporter?.emailAddress ?? "not defined",
  state: item.fields?.status?.name ?? "not defined",
}));

文档

• Nullish_coalescing_operator
• Optional_chaining

Answer 3

如其他解决方案中所述，空值合并运算符和可选链接可以正常工作。

如果你想有一些自定义逻辑，你总是可以处理数据并返回带有要添加到数组的对象的地图。

示例

this.dataSource.data = data.data.map(item => {
  
  // null check or any other custom logic.
  const priority = item.fields && item.fields.priority && item.fields.priority.name ? item.fields.priority.name : 'not defined'

  return {
    id: item._id,
    ticketId: item.key,
    summary: item.fields.summary,
    priority: priority,
    createdAt: item.fields.created,
    createdBy: item.fields.reporter.emailAddress,
    state: item.fields.status.name
}});