RxJS —— Subscription 订阅

Subscription 表示可支配资源的对象，通常是 Observable 的执行。

订阅有一个重要的方法 unsubscribe, 它不带任何参数，只是处理订阅持有的资源。

import { interval } from 'rxjs';

const observable = interval(1000);
const subscription = observable.subscribe((x) => console.log(x));

subscription.unsubscribe();

Subscription 本质上只有一个 unsubscribe() 函数来释放资源或取消 Observable 的执行。

也可以将订阅放在一起，以便调用一个订阅的 unsubscribe() 可以取消订阅多个订阅。通过将一个订阅 “添加” 到另一个订阅上来做到这一点：

import { interval } from 'rxjs';

const observable1 = interval(300);
const observable2 = interval(400);

const subscription = observable1.subscribe((x) => console.log('first: ' + x));
const childSubscription = observable2.subscribe((x) => console.log('second: ' + x));

subscription.add(childSubscription);

setTimeout(() => {
	subscription.unsubscribe();
}, 1000);

// Logs:
// first: 0
// second: 0
// first: 1
// second: 1
// first: 2

订阅还有一个 remove(otherSubscription) 的方法，撤销添加的子订阅

import { interval } from 'rxjs';

const observable1 = interval(300);
const observable2 = interval(400);

const subscription = observable1.subscribe((x) => console.log('first: ' + x));
const childSubscription = observable2.subscribe((x) => console.log('second: ' + x));

subscription.add(childSubscription);
subscription.remove(childSubscription);

setTimeout(() => {
	subscription.unsubscribe();
}, 1000);

// Logs:
// first: 0
// second: 0
// first: 1
// second: 1
// first: 2
// second: 2
// second: 3
// second: 4
// ...

可以看到在 remove 之后，childSubscription 能继续接收到新的值。