RxJS 中的 map 和 pluck 有什么区别？

Question

我试图理解 RxJS 中 map 和 pluck 转换运算符之间的区别。

有人可以帮我吗？

Answer 1

文档说

Pluck ：类似于地图，但仅用于选择其中一个 嵌套 每个发出的对象的属性。

因此，假设你有

[
  { name: 'Joe', age: 30, job: { title: 'Developer', language: 'JavaScript' } },
  { name: 'Sarah', age: 35 }
]

并且您想要所有职位的列表。

pluck

回归

“开发人员”，未定义

使用

map

会有点痛苦（因为

job

可以为空），但是使用 'pluck' 你可以写

pluck('job', 'title')

，它将遍历树寻找

job.title

- 并且不会失败如果

job

为空。

示例取自：https://www.learnrxjs.io/learn-rxjs/operators/transformation/pluck

https://jsfiddle.net/btroncone/n592m597/

P.S：请注意

pluck

已被弃用

弃用说明

使用映射和可选链接：pluck('foo', 'bar') 是map(x => x?.foo?.bar)。将在 v8 中删除。

Answer 2

停止使用勇气！

现在计划在 RxJS v8 中删除

Pluck

。 你知道是什么原因吗？

因为在JS中添加了可选链运算符之后，它本质上只是

Map

的弱版本。

那么两者有什么区别呢？ 两者都用于“转换”将要发出的数据。

Map

可用于... map 一个可观察的发射（就像我们在 JS 中使用

Array.prototype.map

所做的那样），而

Pluck

用于 select/pick 要发射的属性（无需发出我们不关心的属性，从而提高性能）。

但即使在可选链接运算符之前，您也可以只映射属性而不是提取它们。结果和性能大致相同。

pluck('prop')

只是以下的简写：

map(x => x.prop)

那么，实施

Pluck

的原因是什么？

它的实现基本上是为了实现路径遍历安全性，这意味着如果未定义属性，您可以尝试提取嵌套属性而不会出现错误（Map 会抛出错误）：

pluck('foo', 'bar', 'baz'); // no error if foo is not defined
map(x => x.foo.bar.baz) // error if foo is not defined

使用可选链，这种优势不再存在，因为我们可以这样做：

map(x => x?.foo?.bar?.baz)

这是

Pluck

运算符将来被弃用和删除的主要原因。 另一个重要原因是 pluck 的 TS 键入非常复杂，并且不如地图运算符那么强大。

在 GitHub 中获取该信息：

Pluck

弃用的提交已经快一年了，但我仍然没有在文档中看到任何关于未来弃用的警告，因此我在这里发帖，因为我认为了解这是一件好事。因为这个原因我已经停止采摘了。

Answer 3

正如@mgm87所说，您可以使用

map

执行操作。 相反，

pluck

只是取一个值。

例如，使用地图你可以做类似的事情：

this.http.get('...some api url to get a user...')
  .map(response => response.json())
  .map(user => user.age > 18 ? 'major': 'minor')
  .do(isMajorOrMinor => console.log(isMajorOrMinor))

因此您甚至可以有条件地操纵链上的数据。

但是，对我来说最大的区别之一是

map is typed

。 这意味着如果您有一些数据，请说：

interface IUser {
  name: string;
  age: number;
  dogs: IDog[];
}

您在某个时刻收到一个用户，您想从中获取他的狗：

user$
  .map(user => user.dogs)
  .do(dogs => ...) // here, you do NOT need to precise (dogs: IDog[]) because Typescript will make a type inference

这就是为什么我总是使用地图，甚至只是“提取”一些数据。

Answer 4

Map 可以对每个发出的值执行操作。 http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html#instance-method-map https://www.learnrxjs.io/operators/transformation/map.html

// value from observable = 10
map(x => 10*x)
// value from map = 100

Pluck 只是选择每个发出值的嵌套属性之一。 http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html#instance-method-pluck https://www.learnrxjs.io/operators/transformation/pluck.html

// value from observable = {p = 10, w = 100}
pluck('p')
// value from pluck = 10

Answer 5

它们非常相似，但据我了解，map 使用数组，而 pluck 则从对象中获取值。

这是了解具体信息的地方。