tap / do
signature: tap(nextOrObserver: function, error: function, complete: function): Observable
tap(nextOrObserver: function, error: function, complete: function): Observable
Transparently perform actions or side-effects, such as logging.
💡 If you are using and old version of RxJS, tap
used to be known as do
!
Why use tap
?
tap
?Think of tap
as a surveillance camera in a shopping mall. It doesn't interfere with the shoppers (values) moving around but merely observes and records their actions. This operator is best for side effects: actions you want to take in response to values in an observable, without affecting the values themselves.
One of the superpowers of tap
is its utility in debugging. When things aren't going as planned with your observable, instead of tearing apart your chain or inserting numerous logs, simply sprinkle in some tap
operators. It's like adding checkpoints in a video game, helping you swiftly pinpoint issues without disrupting the main flow.
However, a word of caution: remember that tap
is solely for side effects. If you find yourself tempted to modify data within a tap
, it's generally best to resist. That's not its purpose, and you're better off with map
or other transformational operators in these cases.
Lastly, it's best to ensure that the side effects you introduce via tap
are not critical to the main logic of your observable chain, keeping them non-intrusive and harmless.
Examples
Example 1: Logging with tap
( StackBlitz | jsBin | jsFiddle )
Example 2: Using tap with object
( StackBlitz)
Related Recipes
Additional Resources
tap 📰 - Official docs
tap - In Depth Dev Reference
Logging a stream with do 🎥 💵 - John Linquist
Utility operator: do 🎥 💵 - André Staltz
Build your own tap operator 🎥 - Kwinten Pisman
📁 Source Code: https://github.com/ReactiveX/rxjs/blob/master/src/internal/operators/tap.ts
Last updated