Skip to content

lhenriquegomescamilo/rxjs-custom-operators

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

48 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Test Integration NPM SonarCloud

Description

This project is inspired by library as RamdaJS and try to help developers to be more expressive on handling events with these operators.

How to use it

Requirements

  • These operators are designated to project that use RxJs 6+

filters

filterNotNull

  • This operator will filter values that are not null
    of(null, { color: 'red' })
    .pipe(filterNotNull())
    .subscribe(value => console.log(value));
  • The result will be: { color: red }

filterNull

  • This operator will filter only values are null
    of(null, { color: 'red' })
    .pipe(filterNull())
    .subscribe(value => console.log(value));
  • The output will be: null

filterPropNotNull

  • Filter by property that are not null
of({ color: null }, { color: 'red' })
    .pipe(filterPropNotNull('color'))
    .subscribe(value => console.log(value));
  • The output will be: { color: 'red' }

map

mapIfFalse

  • Map if the predicate are false
of({ color: null }, { color: 'red' }).pipe(
    mapIfFalse(
        ({ color }) => color !== null, // predicate 
        ({ color }) => color // ifFalse
    )
)
.subscribe(value => console.log(value));
  • The output will be: red

mapIfTrue

  • Map if the predicate are true
of({ color: 'yellow' }, { color: 'red' }).pipe(
    mapIfTrue(
        ({ color }) => color === 'red', // predicate 
        ({ color }) => color // ifTrue
    )
)
.subscribe(value => console.log(value));
  • The output will be: red

mapIfOrElse

  • Using this operator you can use if/else in the map, for example:
of({ color: 'yellow' }, { color: 'red' }).pipe(
    mapIfOrElse(
        ({ color }) => color === 'yellow', // predicate
        ({ color }) => color, // ifTrue
        ({ color }) => color.length // orElse
    )
)
.subscribe(value => console.log(value));
  • The output will be: "yellow" and then will be print "6"

switchMap

switchMapIfFalse

  • Could be usefully if your predicate are false on switch observables
of({ color: 'yellow' }, { color: 'red' }).pipe(
    switchMapIfFalse(
        ({ color }) => color === 'yellow', // predicate
        ({ color }) => of(color) // ifFalse -> Observable('red')
    )
)
.subscribe(value => console.log(value));
  • The output will be: "red"

switchMapIfTrue

  • Could be usefully if your predicate are true on switch observables
of({ color: 'yellow' }, { color: 'red' }).pipe(
    switchMapIfTrue(
        ({ color }) => color === 'yellow', // predicate
        ({ color }) => of(color) // ifTrue -> Observable('yellow')
    )
)
.subscribe(value => console.log(value));
  • The output will be: "yellow"

switchMapIfOrElse

  • Could be usefully when you need that two action bases on same predicate,similar of if/else, but for this case, in the Observable context, example:
of({ color: 'yellow' }, { color: 'red' }).pipe(
    switchMapIfOrElse(
        ({ color }) => color === 'yellow', // predicate
        ({ color }) => of(color), // ifTrue -> Observable("yellow")
        ({ color }) => of(color.length) // orElse -> Observable(6)
    )
)
.subscribe(value => console.log(value));
  • The output will be: "yellow" and then will be print "3"

tap

tapIfFalse

  • Will be tap when the predicate are false
of({ color: 'yellow' }, { color: 'red' }).pipe(
    tapIfFalse(
        ({ color }) => color === 'yellow', // predicate
        ({ color }) => console.log(color), // ifFalse -> ("red")
    )
)
.subscribe();
  • The output will be: "red"

tapIfTrue

of({ color: 'yellow' }, { color: 'red' }).pipe(
    tapIfTrue(
        ({ color }) => color === 'yellow', // predicate
        ({ color }) => console.log(color), // ifTrue
    )
)
.subscribe();
  • First output: "yellow"

tapIfOrElse

  • Could be usefully when you need that two action bases on the same predicate,similar of if/else, but for this case, in the Observable context, example:
of({ color: 'yellow' }, { color: 'red' }).pipe(
    tapIfOrElse(
        ({ color }) => color === 'yellow', // predicate
        ({ color }) => console.log(color), // ifTrue 
        ({ color }) => console.log(color.length) // orElse
    )
)
.subscribe();
  • First output: "yellow"
  • Second output: "3" because the length of red is 3.

About

Common RxJS operators

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published