RxJS Operators: audit

drownedintech

Steven Boyd-Thompson

Posted on June 20, 2023

RxJS Operators: audit

RxJS is a JavaScript library that enables the creation of asynchronous and event-based programs. The main type is the Observable and a suite of functions and operators are provided to make it easier to work with the data coming through. This series will detail those operators (and a few stand-alone functions) and provide examples of their use.

In this post, we’re going to cover the audit operator.

What does it do?

The audit operator can be used to limit the number of values that are handled by the pipeline. We pass audit a function that returns a second observable, that observable then controls which values get handled. All values coming from the original observable will be ignored. When the second observable sends out a value, audit will allow the last value from the original observable through the pipeline.

This can be hard to get your head around just by having it explained. Let’s take a look at an example that will clear it up.

Example

import { Subject, audit, interval } from 'rxjs';

const auditTrigger$ = new Subject<void>();

interval(1000)
    .pipe(audit(() => auditTrigger$))
    .subscribe(x => {
        console.log(x);
    });

setInterval(() => {
    auditTrigger$.next();
}, 5000);
Enter fullscreen mode Exit fullscreen mode

Here we’re using the interval function as our observable. This sends out incrementing numbers every second, but when we run it we will see:

3
8
13
18
Enter fullscreen mode Exit fullscreen mode

This is the audit operator in action. We have set up audit to respond to events from auditTrigger$, which sends out a message every 5 seconds. So, every 5 seconds audit gets the message to output that last value handled. We can see the emitted values being sent if we update our pipeline to log the emitted value before it gets to the audit function.

import { Subject, audit, interval, tap } from 'rxjs';

const auditTrigger$ = new Subject<void>();

interval(1000)
    .pipe(
        tap(x => console.log(`Value emitted: ${x}`)),
        audit(() => auditTrigger$)
    )
    .subscribe(x => {
        console.log(`Value handled: ${x}`);
    });

setInterval(() => {
    auditTrigger$.next();
}, 5000);
Enter fullscreen mode Exit fullscreen mode

We’ve added the tap operator to our pipeline and configured it to log the value. Now if we run this we see:

Value emitted: 0   
Value emitted: 1   
Value emitted: 2   
Value emitted: 3   
**Value handled: 3**   
Value emitted: 4   
Value emitted: 5   
Value emitted: 6   
Value emitted: 7   
Value emitted: 8   
**Value handled: 8**   
Value emitted: 9
Enter fullscreen mode Exit fullscreen mode

This would come in useful if we’ve got an observable that sends out a lot of values, but we don’t need to handle all of them. We could set it up to only process the values when another, less chatty, observable gets an update.

The source code for this example is available on GitHub:

💖 💪 🙅 🚩
drownedintech
Steven Boyd-Thompson

Posted on June 20, 2023

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

RxJS Operators: buffer
rxjs RxJS Operators: buffer

June 26, 2023

RxJS Operators: auditTime
rxjs RxJS Operators: auditTime

June 23, 2023

RxJS Operators: audit
rxjs RxJS Operators: audit

June 20, 2023

RxJS Operators: catchError
rxjs RxJS Operators: catchError

June 16, 2023

Introduction to RxJS
rxjs Introduction to RxJS

January 25, 2021