返回特定对象的属性值 RXJS .map 和 .filter答案

【问题标题】：Return specific object's property value RXJS .map and .filter返回特定对象的属性值 RXJS .map 和 .filter
【发布时间】：2019-11-15 18:57:48
【问题描述】：

我有一个对象数组，每个对象都有相同的 2 个参数：contentId 和 data。

[
    {
      contentId: 12343,
      data: 'a bunch of data'
    },
    ...
]

我的 RXJS observable 使用以下代码返回对象。

this.$bcc = this.bccService.getBcc().pipe(
  map(data => data.find(obj => obj.contentId == 12343)), // returns the matching object
  // map(data => data.find(obj => obj.contentId == 12343)['data']), // undefined
);

但是，我怎样才能最好地指定匹配对象的 data 参数值？

【问题讨论】：

什么是map？您使用的是哪个库？
澄清了我正在使用 observables 和 RXJS map 运算符的问题。但是，.find 是香草 JS。
您不应该在第一个map 中使用filter（而不是find）吗？否则第二个map 不会得到一个数组，而是对象...或者改变第二个管道参数来处理找到的对象而不是数组..
我不清楚你的确切问题，但你见过pluck吗？它允许您提取特定的嵌套属性。在此处查看文档：rxjs.dev/api/operators/pluck
@DeborahK 每次都赢。 Pluck 似乎是完成这项工作的工具。如果你有空，你能用我的例子来回答吗？

标签： javascript arrays object rxjs

【解决方案1】：

. syntax 或 key syntax 都可以，您可以使用：

data.find(item => item.contentId === 12343).data;
data.find(item => item.contentId === 12343)['data'];

我猜不相关，但不清楚为什么管道中有map？

const data = [
    {
      contentId: 12343,
      data: 'a bunch of data'
    },
     {
      contentId: 45678,
      data: 'a bunch of data'
    },
]

console.log(data.find(item => item.contentId === 12343).data);
console.log(data.find(item => item.contentId === 12343)['data']);

更新

再次查看问题后，语法不是问题。我看到的是您在覆盖数据值的第一个映射中设置数据属性。请尝试如下：

this.$bcc = this.bccService.getBcc().pipe(
  map(data => data.find(obj => obj.contentId == 12343)), // returns the matching object
  map(data => data.propertyInData), // at this point data is {contentId:12343,data: 'a bunch of data'
    },
);

【讨论】：

嘿@chev 谢谢，但正如我的问题中所述，那些返回未定义。关于地图，我将所选对象映射到可观察对象，因为我不需要整个有效负载，只需要匹配对象......并尝试更深入地获取该对象的数据值。
他们都返回未定义？您的问题是如何访问该属性。根据您的数组和上面的示例，它们实际上确实产生了 data 属性。听起来这个问题与pipe 和map 有关。您能否详细说明您将什么库用于管道或展示您自己的管道实现？
map 返回一个值，因此不清楚该数据是否传递到管道语句中的下一个运算符。您可以将第二个运算符替换为与第一个运算符相同的运算符吗？所以他们都是map(data => data.find(obj => obj.contentId == 12343))
@BenRacicot 请查看更新后的答案 - 您正在覆盖第一个 map 中的 data 值，因此后续 map 必须考虑这一点。
感谢您一直以来的帮助。第一张地图得到了我想要的正确对象。（第二张地图实际上只是地图运算符不起作用的一个例子。）map(data => data.propertyInData) 没有得到任何propertyInData 的值。