发布-订阅方式实现异步并发

2019-03-21  本文已影响0人  风雪中的兔子

发布-订阅方式实现异步并发

通过发布/订阅者模式实现异步并发

异步意味着我们不会像同步那样顺序或串行地获取到程序每一步的执行结果,什么时候得到结果是未知的
发布订-阅者模式实现异步并发非常简单,它的关键在于: 每次程序调用都会去执行(即发布)已经被订阅过的所有方法,在订阅的方法中去判断是否满足条件,满足条件则执行接下来的其它操作..


实现流程

  1. 定义对象, 该对象具有订阅方法、发布方法、用于存放订阅方法的集合
let obj = {
    // 用于存放所有订阅的方法,在每次发布的时候会挨个的执行一次
    funcArray: [],
    // 用于订阅,执行它会把要订阅的方法存放到方法集合中
    on (func){
        this.funcArray.push(func);
    },
    // 发布,该方法会把订阅的方法挨个的执行一次,执行的过程中不断地去判断是否满足某个条件
    fire (){
        this.funcArray.forEach( func => func.apply(this, arguments));
    }
}; 

  1. 定义用于监测的对象
// 假定异步全部执行完成后期望得到的结果是: myInfo = {age: 18, sex: 'man'}; ,根据该条件定义对象
let myInfo = {};

// 判断是否满足的条件是: myInfo对象 既有age属性,又有sex属性;
let keys = Object.keys(myInfo);
if(keys.includes('age') && keys.includes('sex')){ // something.....}

  1. 订阅方法
obj.on((key, data) => {
    myInfo[key] = data;
    let keys = Object.keys(myInfo);
    if(keys.includes('age') && keys.includes('sex')){
        console.log(myInfo);
    }
});
  1. 异步执行,执行的回调里面进行发布
setTimeout(()=>{
    obj.fire('age', 18);
}, 2000);

setTimeout(()=>{
    obj.fire('sex', 'man');
}, 3000);
  1. 简单化
    // 订阅的过程,实质上就是把要执行的方法存起来
    let fn1 = function(){ console.log('fn1'); }
    let fn2 = function(){ console.log('fn2'); }
    let arr = [fn1, fn2];
    // 发布实质上就是把订阅的方法挨个的执行
    arr.forEach(fn=>fn());  // 发布
  1. 完整代码 可拷贝直接运行
    let obj = {
        // 用于存放所有订阅的方法,在每次发布的时候会挨个的执行一次
        funcArray: [],
        // 用于订阅,执行它会把要订阅的方法存放到方法集合中
        on (func){
            this.funcArray.push(func);
        },
        // 发布,该方法会把订阅的方法挨个的执行一次,执行的过程中不断地去判断是否满足某个条件
        fire (){
            this.funcArray.forEach( func => func.apply(this, arguments));
        }
    }; 
    
    
    let myInfo = {};
    
    obj.on((key, data) => {
        myInfo[key] = data;
        let keys = Object.keys(myInfo);
        if(keys.includes('age') && keys.includes('sex')){
            console.log('Success! coding...');
        }
    });
    
    setTimeout(()=>{
        obj.fire('age', 18);
    }, 2000);
    
    setTimeout(()=>{
        obj.fire('sex', 'man');
    }, 3000);
上一篇 下一篇

猜你喜欢

热点阅读