![](/img/trans.png)
[英]What are the differences between the two ways to implement Array.prototype.map
[英]What are the differences between Array map and rxjs map
我想知道rxjs和数组上的映射是一样的。 数组映射方法和rxjs映射运算符的使用有何不同?
Array.map
转换单个数组的每个元素 。
console.log( [ 1, 2, 3 ].map(x => x * x) )
// log: [ 1, 4, 9 ]
通常,RXJS Observables更像是一个数据流,但每个数据都是它自己的实体。
您可以选择在Observable中存储数组,但仍然会将每个数组视为单个实体。 每当你调用Subject#next
,你就会提供一个全新的数组。 在这种情况下,没有与使用RXJS的Array#push
等效,因为RXJS并不关心 Observable的内容恰好是一个数组。
// 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 / Observable,每个元素根据(通常)转换函数(技术计算机科学名称将是一个投影 )进行转换,将修改后的对象及其索引作为参数。
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
。 这是我能想到的唯一差异。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.