从对象数组中获取值作为 RxJS 可观察

Question

我有一个对象数组myData$这是一个BevahiorSubject （来自 RxJS 库）。 myData$看起来像这样：

[
  {
    type: 'car',
    year: 12,
  },
  {
    type: 'boat',
    year: 9,
  },
]

我想将 object 的year -key 中的值分配给我的其他 Observable desiredYear$ type -key 的字符串值'car' ，但它应该直接获取值而不存储在数组中。 所以desiredYear$应该等于12 ，而不是[12] 。

第一步，我尝试通过过滤'car' -string 来获得正确的 object：

this.desiredYear$ = this.myData$.pipe(
  map(
    myData => myData.filter(data => data.type === 'car'),
  ),
);

它返回所需值的 object 但还不是year -key 的所需值，结果（见下文）存储在数组中（我不想要）：

[
    {
        type: 'car',
        year: 12,
    },
]

怎么办 go 直接得到12退货？

Answer 1

我想说更合适的是使用Array#find而不是Array#filter并直接访问year属性

this.desiredYear$ = this.myData$.pipe(
  map(
    myData => myData.find(data => data.type === 'car')?.year,
  ),
);

可选链接?. 如果Array#find返回undefined ，运算符将减轻错误。 如果数组中没有满足条件data.type === 'car'的元素，它会怎样。

请注意，在这种情况下， desiredYear$ observable 将发出undefined 。 如果您想忽略undefined的排放，您可以在filter运算符中使用 pipe

this.desiredYear$ = this.myData$.pipe(
  map(
    myData => myData.find(data => data.type === 'car')?.year,
  ),
  filter(year => !!year)
);