数组映射和 rxjs 映射有什么区别



我想知道 rxjs 和数组上的地图的工作方式相同。数组映射方法和 rxjs 映射运算符的使用有什么区别?

Array.map转换单个数组的每个元素

console.log( [ 1, 2, 3 ].map(x => x * x) )
// log: [ 1, 4, 9 ]

一般来说,RXJS 可观察量更像是一个数据流,但每个数据都是它自己的实体。

您可以选择将数组存储在可观察对象中,但每个数组仍被视为单个实体。每次调用Subject#next时,您都会提供一个全新的数组。在这种情况下,没有等效于 RXJS 的Array#push,因为 RXJS 不关心可观察量的内容恰好是一个数组。

// Observable that holds an array as its type
const subject: Subject<number[]> = new Subject<number[]>();
subject.pipe(
// the value here is a full array
map(arr => arr.map(x => x * x))
).subscribe(arr => console.log(arr));
subject.next([ 1, 2, 3 ]);
// log: [ 1, 4, 9 ]
subject.next([ 7, 8, 9 ]);
// log: [ 49, 64, 81 ]

*奖励:如果你设置了一个ReplaySubject,你可以让一些东西更像一个数组。Subject的这种实现实际上重播了提供给它的所有数据(或基于您实例化它的子集(。正如你将看到的,这方面的限制是你只能推到最后,你必须创建一个新的订阅才能看到整个"数组",但这仍然是一个有趣的思想实验。

const subject: ReplaySubject<number> = new ReplaySubject<number>();
subject.next(1);
subject.next(2);
subject.next(3);
const transformed: Observable<number> = subject.pipe(
map(x => x * x)
);
transformed.pipe(first()).subscribe(x => console.log(x));
// log: 1
// log: 4
// log: 9
subject.next(9);
transformed.pipe(first()).subscribe(x => console.log(x));
// log: 1
// log: 4
// log: 9
// log: 81

它们的功能完全相同,它们给出了一个新的数组/可观察(分别(,每个元素根据(通常(一个转换函数(技术计算机科学名称将是一个投影(进行转换,将修改后的对象及其索引作为参数。

Array.map本身就是Array原型的一部分。你可以在任何 JavaScript 环境中的任何数组上使用它。(当然,前提是你没有搞砸Array.prototype(

必须导入Observable.map。(对于 RxJS 6 :import { map } from 'rxjs/operators';, 对于旧版本:import { map } from 'rxjs/add/operator/map'


有一个很小但显着的差异

Array.map转换函数可以访问正在转换的整个数组(投影函数中的第三个参数(。

示例 :

let arr = ['a', 'b', 'c'];
let arrResult = arr.map(
(elem, index, wholeArray) => 'element ' + elem + ' was in position ' + index + ' in array ' + wholeArray);
console.log(arrResult);

在 Observable 的上下文中,这"当然"是不可能的(一般来说(,因为在发出每个元素时可能不知道发射值的"整个列表"。


相反,还有另一个小区别:Observable.map运算符采用(可选(thisArg参数,因此转换函数可以访问某些指定的上下文。

我认为这个其他区别是微不足道的:Array.map不需要这个,因为它是一个函数,你也可以用JavaScript中调用函数的各种方式指定你自己的"this"。(我找不到这部分的好链接,欢迎任何想在此答案中添加参考的人(。

此外,无论如何,在最后一点上受到挑战会很有趣。

RxJS用于处理Observables,本机map用于Arrays。 这是我能想到的唯一差异。

最新更新