在Angular中Promise和Observable之间有什么区别?
每一个例子都有助于理解这两种情况。在什么情况下,我们可以使用每种情况?
在Angular中Promise和Observable之间有什么区别?
每一个例子都有助于理解这两种情况。在什么情况下,我们可以使用每种情况?
当前回答
Promise:是一个ES6特性,它处理在创建时立即执行的异步代码,该代码当时只能发出一个值,并且不可取消。随着现代应用程序和功能需求的复杂性,如果我们要同时执行多个承诺,或者在执行之前进行过滤或进行一些转换,那么就必须实现复杂的代码:
myPromise.then((resolvedValue) => {
console.log(resolvedValue);
}, (error) => {
console.log(error);
});
Observable:是Rxjs库提供的一个Object,它帮助我们处理JavaScript应用程序中的反应式编程,它提供链接和订阅来处理复杂的应用程序,具有可取消的优点,同时提供许多值。此外,我们还可以从应用其他运算符(如retry()、map()、filter()、switchMap()等)的链接中获益,这有助于处理复杂的用例和繁重的用户界面。
即时搜索示例:
search(terms: Observable<string>) {
return terms.pipe(
debounceTime(400),
distinctUntilChanged(),
switchMap((term) => this.searchEntries(term))
);
}
并行的许多APIS调用示例:
let character = this.http.get('https://jsonplaceholder.typicode.com/todos');
let characterHomeworld = this.http.get(
'https://jsonplaceholder.typicode.com/posts'
);
forkJoin([character, characterHomeworld]).subscribe((results) => {
console.log('result °', results[0]);
console.log('result 1', results[1]);
});
其他回答
答案中缺少可观察到的一个缺点。Promise允许使用ES7异步/等待函数。使用它们,您可以像编写同步函数调用一样编写异步代码,因此不再需要回调。Observables做到这一点的唯一可能性是将它们转换为Promise。但当您将它们转换为Promise时,只能再次有一个返回值:
async function getData(){
const data = await observable.first().toPromise();
//do stuff with 'data' (no callback function needed)
}
进一步阅读:如何“等待”Rx Observable?
承诺-提供单一的未来价值。不懒惰。无法取消。它要么拒绝,要么解决。
可观察-提供多个未来值。懒惰的可取消。它提供了其他方法,如map、filter和reduce。
我总结了以下差异,
可观察:
Observable只是一个函数,它接受一个观察者并返回一个函数observer:一个带有下一个错误的对象。Observer允许订阅/取消订阅其数据流,发出下一个值,通知观察者错误和通知观察者流完成情况Observer提供了一个函数来处理下一个值、错误和流结束(UI事件、http响应、带有web套接字的数据)。随着时间的推移使用多个值它可以取消/重试,支持map、filter、reduce等运算符。创建Observable可以是-Observable.create()-返回可在-ObservatorObservable.from()-将数组或可迭代对象转换为-ObservableObservable.fromEvent()-将事件转换为Observable-Observable.fromPromise()-将Promise转换为Observable-Observable.range()-返回指定范围内的整数序列
承诺:
一个承诺代表着一项未来将完成的任务;承诺通过价值来解决;承诺被例外拒绝;不可取消,并返回单个值承诺暴露函数(然后)-然后返回一个新的承诺;-允许基于状态-处理程序保证按照所附的顺序执行;
Observables和Promise帮助我们使用JavaScript/TypeScript中的异步功能。它们在许多情况下非常相似,但它们之间仍有一些差异。
概述:
Promise和Observables都帮助我们处理异步操作。当这些异步操作完成时,它们可以调用某些回调。Promise只能处理一个事件,Observables用于一段时间内的事件流承诺一旦待定,就不能取消可以使用运算符转换可观测数据发射
您可以始终使用可观察对象来处理异步行为,因为可观察对象具有承诺提供的所有功能(+额外功能)。然而,有时不需要Observables提供的额外功能。然后,导入一个库以供其使用将是额外的开销。
何时使用Promise:
当您有一个要处理结果的异步操作时,请使用promise。例如:
var promise = new Promise((resolve, reject) => {
// do something once, possibly async
// code inside the Promise constructor callback is getting executed synchronously
if (/* everything turned out fine */) {
resolve("Stuff worked!");
}
else {
reject(Error("It broke"));
}
});
//after the promise is resolved or rejected we can call .then or .catch method on it
promise.then((val) => console.log(val)) // logs the resolve argument
.catch((val) => console.log(val)); // logs the reject argument
因此,promise执行一些代码,它要么解析,要么拒绝。如果称为resolve或reject,则promise将从挂起状态变为resolved或reject状态。当promise状态被解析时,将调用then()方法。当promise状态被拒绝时,将调用catch()方法。
何时使用Observables:
当一段时间内存在需要处理的数据流时,使用Observables。流是一系列随时间而可用的数据元素。流的示例有:
用户事件,例如单击或键控事件。用户随时间生成事件(数据)。Websockets,在客户端与服务器建立WebSocket连接后,它会随时间推移推送数据。
在Observable中,指定了下一个事件发生的时间、错误发生的时间或Observable完成的时间。然后,我们可以订阅这个可观察的,它激活了它,在这个订阅中,我们可以传递3个回调(不必总是传递所有回调)。成功时执行一次回调,错误时回调,完成时回调。例如:
const observable = Rx.Observable.create(observer => {
// create a single value and complete
observer.onNext(1);
observer.onCompleted();
});
source.subscribe(
x => console.log('onNext: %s', x), // success callback
e => console.log('onError: %s', e), // error callback
() => console.log('onCompleted') // completion callback
);
// first we log: onNext: 1
// then we log: onCompleted
当创建一个可观察对象时,它需要一个回调函数,该函数提供一个观察者作为参数。在这个观察者上,您可以调用onNext、onCompleted和onError。然后,当Observable被订阅时,它将调用传入订阅的相应回调。