异步操作：回调、generator、Promise

异步操作：

1. 回调
2. Promise
3. generator

//回调

// //回调
$.ajax({
  url: xxx,
  dataType: 'json'
  success(data1){
    $.ajax({
      url: xxx,
      dataType: 'json'
      success(data2){
        $.ajax({
          url: xxx,
          dataType: 'json'
          success(data3){
            //完事儿
          },
          error(){
            alert('错了');
          }
        });
      },
      error(){
        alert('错了');
      }
    });
  },
  error(){
    alert('错了');
  }
});

Promise

// Promise
Promise.all([
  $.ajax({url: xxx, dataType: 'json'}),
  $.ajax({url: xxx, dataType: 'json'}),
  $.ajax({url: xxx, dataType: 'json'})
]).then(results=>{
  //完事儿
}, err=>{
  alert('错了');
});

//generator
runner(function *(){
  let data1=yield $.ajax({url: xxx, dataType: 'json'});
  let data2=yield $.ajax({url: xxx, dataType: 'json'});
  let data3=yield $.ajax({url: xxx, dataType: 'json'});

  //完事儿
});

------------------------------------------------------------------------------

带逻辑-普通回调

//带逻辑-普通回调
$.ajax({url: 'getUserData', dataType: 'json', success(userData){
  if(userData.type=='VIP'){
    $.ajax({url: 'getVIPItems', dataType: 'json', success(items){
      //生成列表、显示...
    }, error(err){
      alert('错了');
    }});
  }else{
    $.ajax({url: 'getItems', dataType: 'json', success(items){
      //生成列表、显示...
    }, error(err){
      alert('错了');
    }});
  }
}, error(err){
  alert('错了');
}});

带逻辑-Promise

//带逻辑-Promise
Promise.all([
  $.ajax({url: 'getUserData', dataType: 'json'})
]).then(results=>{
  let userData=results[0];
  if(userData.type=='VIP'){
    Promise.all([
      $.ajax({url: 'getVIPItems', dataType: 'json'})
    ]).then(results=>{
      let items=results[0];

      //生成列表、显示...
    }, err=>{
      alert('错了');
    });
  }else{
    Promise.all([
      $.ajax({url: 'getItems', dataType: 'json'})
    ]).then(results=>{
      let items=results[0];

      //生成列表、显示...
    }, err=>{
      alert('错了');
    });
  }
}, err=>{
  alert('失败');
});

带逻辑-generator

//带逻辑-generator
runner(function *(){
  let userData=yield $.ajax({url: 'getUserData', dataType: 'json'});
  if(userData.type=='VIP'){
    let items=yield $.ajax({url: 'getVIPItems', dataType: 'json'});
  }else{
    let items=yield $.ajax({url: 'getItems', dataType: 'json'});
  }
  //生成、...
});

------------------------------------------------------------------------------

Promise——一次读一堆
generator——逻辑性

------------------------------------------------------------------------------