常见的异步编程的几种方法

Posted GISer杰

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了常见的异步编程的几种方法相关的知识,希望对你有一定的参考价值。

  1. 回调函数
  2. Promise
  3. Rxjs

1、回调函数

  /* 利用回调函数执行异步操作 */
   getCallBackData(callback) {  // 把函数作为参数传递进去
     setTimeout(() => {
       let data = \'this is callback data\';
       callback(data);  // 将异步数据作为参数传递给函数
     }, 1000)
   }
 
 
 /* 函数的调用----获取 callback data */
   this.getCallBackData((result) => {
     console.log(result);  // 回调函数只能在传入函数(参数)中处理
   });  

 

2、Promise

 /* Promise */
 getPromiseData() {
     return new Promise((resolve, reject) => {  
       setTimeout(() => {
         const data = \'this is Promise data\';
         resolve(data); // 将异步数据及相关操作封装在 Promise对象中,通过resolve返回
       }, 3000)
     })
   }
 
 
 /*  获取 promise data */
 const promiseData = this.getPromiseData()
 promiseData.then(x => {
     console.log(x);
   })

 

3、Rxjs

 /* rxjs */
 getRxjsData() {
   return new Observable(observer => {
     setTimeout(() => {
       const data = \'this is rxjs data\';
       observer.next(data);  // 将异步数据及相关操作封装在 Observable 中,通过next返回
     }, 3000);
   })
 }
 
 
  /* 获取 rxjs data */ 
 const rxjsData = this.request.getRxjsData();
 const stream = rxjsData.subscribe(x => { // 将 subscribe 返回的subscription赋值给一个变量,取消订阅要通过返回的subscription来取消
     console.log(x);
   });
注意:不管是通过 Promise 的 resolve返回,还是通过 getRxjsData 的 observer 返回,返回的时间用户都不能马上得到,必须分别使用 then 和 subscribe 来订阅
 
4、Rxjs取消订阅
 /* 取消订阅 3s后返回rxjs data,但是刚过1s,我想取消,不想订阅了 */
 setTimeout(() => {
    stream.unsubscribe();     // promise创建之后动作无法撤回,而Observable可以撤回发出的动作
  }, 1000)

 

5、rxjs订阅后多次执行

  getMutipleRxjsData() {
     return new Observable(observer => {
       let count = 0;
       setInterval(() => {
         observer.next(count++);
         // 对于 promise来说,最终结果要么是resolve或者reject,而且都只能触发一次,如果在同一个promise对象上多次调用resolve方法,则会抛出异常
         // 而Observable不一样,它可以通过next方法源源不断的触发下一个值
       }, 1000);
     })
   }
 
 
 /* rxjs 多次执行 */ 
 this.getMutipleRxjsData().subscribe(x => {
       console.log(x);
     })

 

以上是关于常见的异步编程的几种方法的主要内容,如果未能解决你的问题,请参考以下文章

JS异步操作的几种模式

javascript实现异步的几种方法

Laravel:如何在控制器的几种方法中重用代码片段

angular--异步编程

异步编程的几种方式,你知道几种?

.Net中的几种异步模式