Why do we use two filters in code below instead one?
fromEvent<MouseEvent>(this.mapElement, "click")
.pipe(
filter(e => !this.props.disableEvents),
filter(_ => !this.mouseState.moved && mouseDownInMap)
)
.subscribe(e => {});
Why not:
fromEvent<MouseEvent>(this.mapElement, "click")
.pipe(filter( e => !this.props.disableEvents && !this.mouseState.moved && mouseDownInMap))
.subscribe(e => {});
Also, why we need .pipe()
if it works without pipe too?
You can combine them into a single filter
.
But for the sake of code maintenance it's often easier to read two separate filter functions, especially if they're conceptually unrelated - and to avoid horizontal scrolling.
Another reason is that the filter functions themselves may be defined elsewhere, in which case you'll have to use separate filter
calls anyway:
e.g.
function whenEventsAreEnabled( e ) {
return !this.props.disableEvents;
}
function whenMouseIsInMap( e ) {
!this.mouseState.moved && mouseDownInMap
}
fromEvent<MouseEvent>(this.mapElement, "click")
.pipe(
filter( whenEventsAreEnabled ),
filter( whenMouseIsInMap )
)
.subscribe(e => {});
Also, why we need
.pipe()
if it works withoutpipe
too?
You do need pipe
. You can only get-away without using pipe
if you're using RxJS in backwards compatibility mode. Modern RxJS always requires pipe()
to create a pipeline for the observable's emitted values/objects.