behavior-subject.ts

import { Subject, BehaviorSubject, Observable } from "rxjs";

const subject: Observable<string> = new BehaviorSubject("Hello");

subject.subscribe((value) => {
    console.log("1st sub: received value", value);
});

subject.next("How are you doing?");
subject.next("Goodbye");

subject.subscribe((value) => {
    console.log("2nd: sub: received value", value);
});

class SomeComponent {
    @Input() thing$: BehaviorSubject<any>;
}

global-event-example.ts

import { GlobalEventService } from "../global-event";

const globalEventService = new GlobalEventService();

window["globalEventService"] = globalEventService;

const ping$ = globalEventService.listenToEvent("ping");

ping$.subscribe((value) => {
    console.log("got pinged with", value);
});

globalEventService.sendEvent("ping", 1);

global-event.ts

import { Subject, Observable } from "rxjs";
import { filter, map } from "rxjs/operators";

class GlobalEventService {
    
    subject$ = new Subject();

    listenToEvent(event: string): Observable<any> {
        return this.subject$.pipe(
            filter((event: any) => {
                return event.type === event;
            }),
            map((event) => event.data)
        );
    }

    sendEvent(event: string, data: any): void {
        this.subject$.next({
            type: event,
            data: data
        });
    }
}

replay-subject.ts

import { Subject, ReplaySubject } from "rxjs";

const subject: Subject<string> = new ReplaySubject();

subject.subscribe((value) => {
    console.log("1st sub: received value", value);
});

subject.next("Hello");
subject.next("How are you doing?");
subject.next("Goodbye");

subject.subscribe((value) => {
    console.log("2nd: sub: received value", value);
});

store-example.ts

import { Store } from "../store";

interface IUser {
    username: string;
    email: string;
}

interface IAppState {
    user?: IUser;
}

const initialState = {
    user: {
        username: "Don"
    }
};

const store = new Store(initialState);

store.subject$.subscribe((value) => {
    console.log("the whole app state changed", value);
});

window["store"] = store;

const username$ = store.get(["user", "username"]);
const user$ = store.get(["user"]);
user$.subscribe((value) => {
    value.email = "dog@cat.com";
});

username$.subscribe((value) => {
    console.log("got username", value);
});

store.set(["user", "username"], "Daria");

store.ts

import { Observable, BehaviorSubject, Subject } from "rxjs";
import _ = require("lodash");
import { set } from "lodash/fp";
import { map, distinctUntilChanged } from "rxjs/operators";

export class Store {

    subject$: BehaviorSubject<any>;

    constructor(initialState: any) {
        this.subject$ = new BehaviorSubject(initialState);
    }
    
    get(path: string[]): Observable<any> {
        return this.subject$.pipe(
            map((state) => _.get(state, path)),
            distinctUntilChanged()
        );
    }

    set(path: string[], value: any): void {
        _.set(this.subject$.value, path, value);
        this.subject$.next(this.subject$.value);
    }
}

subject.ts

import { Subject, Observable } from "rxjs";

const subject: Subject<string> = new Subject();
window["subject"] = subject;

subject.subscribe((value) => {
    console.log("1st sub: received value", value);
});

subject.next("Hello");
subject.next("How are you doing?");

subject.subscribe((value) => {
    console.log("2nd: sub: received value", value);
});

subject.next("Goodbye");