JavaScript subscribe()方法
Muhammad Muzammil Hussain
2023年1月30日
2022年5月10日
我们将了解订阅功能的用途及其在 JavaScript 或 jQuery 中的用法。我们将通过不同的示例了解如何在 JavaScript 代码语句中使用 subscribe() 方法创建和执行订阅。
在 JavaScript 中使用 .subscribe() 方法
.subscribe() 方法类似于 jQuery 的 Promise .then()、.catch() 和 .finally() 方法，但它处理的是 Observables 的 Promise。
如果我们希望在失败情况下（如 .catch()）或成功情况下（如 .finally()）执行和运行一些逻辑，我们可以将该逻辑传递给订阅，如下所示：
myObservable.subscribe(
value => toDoOnlyOnSuccess(value),
error => toDoOnlyOnError(error),
() => toDoAnyCase()
);
为了表示一个可支配的资源，我们使用订阅，它是一个对象。它是一个 observable 的执行。
一个基本的 subscribe 方法是 unsubscribe()，它不带参数并丢弃被订阅保留的资源。在 RxJs 的早期版本中，订阅被称为 Disposable，这是一种 JavaScript 的响应式扩展。
import { interval } from 'rxjs';
const myObservable = interval(1000);
const mySubscription = myObservable.subscribe(x => console.log(x));
// ongoing Observable execution is canceled
// which was started by calling subscribe with an Observer.
mySubscription.unsubscribe();
在 JavaScript 中使用 unsubscribe() 方法
我们在 Subscription 中有 unsubscribe() 函数来释放资源或取消正在进行的 observable 执行。我们还可以将订阅放在一起，为多个订阅调用 unsubscribe() 方法。
我们可以通过将一个订阅添加到另一个订阅中来实现这一点，如下所示：
import { interval } from 'rxjs';
const observableA = interval(500);
const observableB = interval(400);
const subscriptionMain = observableA.subscribe(x => console.log('first subscription: ' + x));
const SubscriptionChild = observableB.subscribe(x => console.log('second subscription: ' + x));
mySubscription.add(SubscriptionChild);
setTimeout(() => {
// Unsubscribes subscriptionMain and SubscriptionChild together
mySubscription.unsubscribe();
}, 1000);
输出：
second subscription: 0
first subscription: 0
second subscription: 1
first subscription: 1
second subscription: 2
jQuery 中的 subscribe() 插件
一个用作事件聚合器的 jQuery 插件 subscribe()，事件名称可以定义为 .subscribe("HelloWorld",function(){})。它使开发人员能够在 JavaScript/jQuery 中编写低耦合的代码。
我们需要为事件名称指定事件句柄，如下所示：
`.subscribe("HelloWorld", function(data) {alert("Hello World!");});`
subscribe() 方法使用事件处理程序订阅特定的事件名称，当主题被订阅时，处理程序将被执行。