异步操作：回调、generator、Promise

异步操作：

回调Promisegenerator

//回调

// //回调 $.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——逻辑性 ------------------------------------------------------------------------------