Subject types (Subject, BehaviorSubject, ReplaySubject) in Angular - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to create a simple Subject in Angular.

Angular

import { [1] } from 'rxjs';

const subject = new [1]();

Drag options to blanks, or click blank then click option'

AReplaySubject

BBehaviorSubject

CSubject

DObservable

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'Observable' instead of 'Subject'.

Confusing 'BehaviorSubject' or 'ReplaySubject' for the basic Subject.

The Subject class is imported from 'rxjs' and instantiated to create a new Subject.

2fill in blank

medium

Complete the code to create a BehaviorSubject with an initial value of 0.

Angular

import { BehaviorSubject } from 'rxjs';

const behaviorSubject = new BehaviorSubject([1]);

Drag options to blanks, or click blank then click option'

Anull

B0

Cundefined

D''

Attempts:

3 left

💡 Hint

Common Mistakes

Passing null or undefined as initial value.

Forgetting to provide an initial value.

A BehaviorSubject requires an initial value. Here, 0 is used as the starting value.

3fill in blank

hard

Fix the error in the code to create a ReplaySubject that buffers the last 3 values.

Angular

import { ReplaySubject } from 'rxjs';

const replaySubject = new ReplaySubject([1]);

Drag options to blanks, or click blank then click option'

Atrue

B'3'

Cundefined

D3

Attempts:

3 left

💡 Hint

Common Mistakes

Passing a string '3' instead of number 3.

Passing a boolean or undefined.

The ReplaySubject constructor takes a number indicating how many previous values to buffer. It must be a number, here 3.

4fill in blank

hard

Fill both blanks to subscribe to a Subject and log emitted values.

Angular

subject.[1](value => {
  console.[2](value);
});

Drag options to blanks, or click blank then click option'

Asubscribe

Bnext

Clog

Derror

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'next' instead of 'subscribe' to listen.

Using 'console.error' instead of 'console.log'.

Use subscribe to listen to Subject emissions, and console.log to print values.

5fill in blank

hard

Fill all three blanks to create a BehaviorSubject, emit a value, and subscribe to log it.

Angular

const behaviorSubject = new [1](0);

behaviorSubject.[2](5);

behaviorSubject.[3](value => console.log(value));

Drag options to blanks, or click blank then click option'

ABehaviorSubject

Bnext

Csubscribe

DSubject

Attempts:

3 left

💡 Hint

Common Mistakes

Using Subject instead of BehaviorSubject for initial value.

Using subscribe to emit values instead of next.

Create a BehaviorSubject with initial 0, emit a new value with next, and listen with subscribe.