javascript 之异步执行几个模式

1、回调函数

function f1(callback) {
  // f1 的代码

  // f1 执行完成后,调用回调函数
  callback();
}

类同于

f1(f2);

2、采用时间驱动模式,事件监听

function f1(){
  setTimeout(function () {
    // f1的任务代码
    f1.trigger('done');
  }, 1000);
}

function f2(){
console.log('事件监听');
}
f1.on('done',f2);

3、发布订阅,类同于rabbitmq生产者,消费者机制

function f1(){
    setTimeout(function () {
        // f1的任务代码
        jQuery.publish("done");
    }, 1000);
}
jQuery.subscribe("done", f2);

异步流程控制

async(1, function(value){
  async(value, function(value){
    async(value, function(value){
      async(value, function(value){
        async(value, function(value){
          async(value, final);
        });
      });
    });
  });
});
```

串行执行
```javascript
var items = [ 1, 2, 3, 4, 5, 6 ];
var results = [];
function series(item) {
  if(item) {
    async( item, function(result) {
      results.push(result);
      return series(items.shift());
    });
  } else {
    return final(results);
  }
}
series(items.shift());
```

并行执行
```javascript
var items = [ 1, 2, 3, 4, 5, 6 ];
var results = [];

items.forEach(function(item) {
  async(item, function(result){
    results.push(result);
    if(results.length == items.length) {
      final(results);
    }
  })
});
```

并行与串行的结合
```javascript

var items = [ 1, 2, 3, 4, 5, 6 ];
var results = [];
var running = 0;
var limit = 2;

function launcher() {
  while(running < limit && items.length > 0) {
    var item = items.shift();
    async(item, function(result) {
      results.push(result);
      running--;
      if(items.length > 0) {
        launcher();
      } else if(running == 0) {
        final(results);
      }
    });
    running++;
  }
}
launcher();
```

promise
```javascript
(new Promise(f1)).then(f2);
```

```javascript
// 传统写法
step1(function (value1) {
  step2(value1, function(value2) {
    step3(value2, function(value3) {
      step4(value3, function(value4) {
        // ...
      });
    });
  });
});

// Promises的写法
(new Promise(step1))
  .then(step2)
  .then(step3)
  .then(step4);
```

Promise对象的优点在于,让回调函数变成了规范的链式写法




你可能感兴趣的:(javascript 之异步执行几个模式)