I'm reading the docs for mapTo and I'm simply not getting the point of that operator's existence. I get what it does but the two line below should produce equivalent result.

const oute = "bzzz";
const result1 = source.map(a => oute);
const result2 = source.mapTo(oute);

Yet, the creators of RxJs chose to increase plexity by adding an extra method. It seems pointless as such, so I'm suspecting there's more to it than what meets the eye.

What's the point of having a dedicated operator for such a specific case?

I'm reading the docs for mapTo and I'm simply not getting the point of that operator's existence. I get what it does but the two line below should produce equivalent result.

const oute = "bzzz";
const result1 = source.map(a => oute);
const result2 = source.mapTo(oute);

Yet, the creators of RxJs chose to increase plexity by adding an extra method. It seems pointless as such, so I'm suspecting there's more to it than what meets the eye.

What's the point of having a dedicated operator for such a specific case?

• javascript
• typescript
• rxjs

• 1 There isn't anything more to it than meets the eye; it's just shorthand. As far as why you'd have to ask them. – Dave Newton Commented Apr 1, 2021 at 16:53
• @DaveNewton That's a surprise. There's no mentioning of its status as convenience method or shorthand, so, naturally, I assumed there was some magic to it, like performance or something like that. But given your ment, it's a bit of disappointment. :) – Konrad Viltersten Commented Apr 1, 2021 at 16:57
• There's certainly some optimisation possibilities when you know that you're mapping to a constant value. I can't tell though whether these are actually implemented, or even planned. Did you take a look at the implementation yourself? – Bergi Commented Apr 1, 2021 at 16:58
• 2 github./ReactiveX/rxjs/blob/master/src/internal/operators/… source] sums it up; I mean technically I suppose it's fractionally faster since it doesn't increment the index :shrug: github./ReactiveX/rxjs/blob/master/src/internal/operators/… – Dave Newton Commented Apr 1, 2021 at 16:59
• 1 The function in map is executed on each value emission while mapTo argument is calculated once when the operator is created. – Shlang Commented Apr 1, 2021 at 17:12

2 Answers 2

The differences between map and mapTo

• map source code
• mapTo source code

At first sight, we can see that map accepts a callback function

function map<T, R>(project: (value: T, index: number) => R, thisArg?: any)

whereas mapTo accepts a static value

function mapTo<R>(value: R)

So, a clear difference is that map's callback function can generate a value depending on the arguments provided. This is not the case for mapTo, where you just simply provide a value that will be always passed along to the next subscriber in the chain. If you will, mapTo(value) can be though of as

map(() => value)

We can also deduce this from the source code:

// `mapTo`
() => subscriber.next(value)

// `map`; `project` is the provided callback function
() => subscriber.next(project.call(thisArg, value, index++));

But you might not want to do that, why call a function when you can directly use a value?

Some use cases

A use case might be when you have a NgRx effect and you want to return the same, non-dynamic, action, when something happens.

createEffect(
  () => this.actions.pipe(
    /* some logic here... */
    mapTo(staticAction('a message here')),
  )
);

Another one, which might not seem very practical, is when you want to simulate some requests ing in:

merge(
  timer(300).pipe(mapTo("req#1")),
  timer(600).pipe(mapTo("req#2")),
  timer(100).pipe(mapTo("req#3")),
  timer(900).pipe(mapTo("req#4")),
).pipe(
  /* some plicated logic here... */
)

Anyway, the point of this operator is, at least from my perspective, to indicate that you want to pass along static values, thus values that are not dependent on data from the previous subscriber.

mapTo is really just a convenience for a specific mapping scenario where:

1. The output does not depend on emission from the source observable
2. The output will always be the same static value

The second point is important to note, because if the target value changes over time, there will be differences in the output between map(a => target) and mapTo(target):

• map(a => oute) - will return the current value of 'oute' (possibly different results)
• mapTo(oute) - will return the first emitted value of 'oute' (same result every time)

let oute = 0;
// change 'oute' every second
interval(1000).pipe(tap(n => oute = n * 2)).subscribe();

const source = interval(1000).pipe(take(4));

source.pipe(map(a => oute));  // 0, 2, 4, 6
source.pipe(mapTo(oute));     // 0, 0, 0, 0

StackBlitz demo