Remove secondary mappings for flattening operators

For operators like mergeMap, switchMap, concatMap, etc, we have a secondary selector. It’s not used a lot in practice that I’ve seen. Originally, it added a lot of value in terms of perf because it prevented a closure… however, in practice it makes it harder to isolate errors from observation chains, and in a world with Turbofan, I’m not sure the performance benefit is there. We could eliminate a good amount of code in the library written to support this.

Use and Alternatives

Observable.of(1, 2, 3).mergeMap(a => range(0, a), (a, b) => a + b);

/// which is mostly the same as

Observable.of(1, 2, 3).mergeMap(a => range(0, a).map(b => a + b))

// however if there's an error in that second map, you're forced to kill the whole observable...

Observable.of(1, 2, 3)
  .mergeMap(a => range(0, a), (a, b) => { throw new Error('lol') })
  .catch(err => empty())

// rather than this, which is much more common

Observable.of(1, 2, 3)
  .mergeMap(
    a => range(0, a)
      .map(b => a + b)
      .catch(err => empty())
  )

Proposed Change

Eliminate the second argument to mergeMap, concatMap, switchMap, et. al. and instruct people to use .map within the projection function if they want a secondary level of mapping.

[benlesh]

With regards to that argument I made above, the problem isn’t so much with the “throwable” part as it is in patterns like you’d see in redux-observable or ngrx, where you might have something that throws, moving the catch outside of the flattening operation will kill your entire stream, but catching it inside gets weird with that secondary map:

// redux observable epic or ngrx effect
action$ => action$.ofType('LOAD_DATA')
  .switchMap(() => 
    makeAjaxCall()
      .catch(err => {
        console.log('ajax failed')
        return Observable.of({ type: 'AJAX_ERROR', err })
      }),
   (responseOrError) =>
    responseOrError.type === 'AJAX_ERROR'
      ? responseOrError
      : { type: 'AJAX_RESPONSE', response: responseOrError }
  )

As you can see it gets ugly fast… But by just using a map it cleans it up.

// redux observable epic or ngrx effect
action$ => action$.ofType('LOAD_DATA')
  .switchMap(() => 
    makeAjaxCall()
      .map(response => ({ type: 'AJAX_RESPONSE', response }))
      .catch(err => {
        console.log('ajax failed')
        return Observable.of({ type: 'AJAX_ERROR', err })
      })
  )

[wmaurer]

I’ve not a lot to technically add to this discussion. I can only say that I very often use the secondary selector, and my team has followed my practice. This change would cause us to have to touch a lot of files across quite a number of projects. However according to your observations, we’re exceptions to the rule …