promise用法详解

Posted 2020-10-11

es6的promise可谓是异步书写的一大福音，过去异步js书写是函数嵌套函数的方式，promise出现后书写异步js代码就变得美观得多了

以前的写法：回调函数不停嵌套

ajax(‘/banners‘, function (banner_data){
  ajax(‘/hotItems‘, function (hotitem_data){
    ajax(‘/slides‘, function (slide_data){
      ajax(‘/slides‘, function (slide_data){

      }, function (){
        alert(‘读取失败‘);
      });
    }, function (){
      alert(‘读取失败‘);
    });
  }, function (){
    alert(‘读取失败‘);
  });
}, function (){
  alert(‘读取失败‘);
});

Promise写法：

Promise.all([promise1,promise2..]).then(res=>{},err=>{})

这个方法是等数组所有异步请求都返回结果才执行then，都成功执行第一个回调函数，其中一个失败了就执行第二个回调函数

Promise.all([
      promise1,
      promise2
    ]).then(function (results){
      let [data1, data2]=results;
      alert(‘成功了‘);
      console.log(arr, json);
    }, function (err){
      alert(‘失败了‘);
    });

Promise.race([promise1,promise2..]).then(res=>{},err=>{})

这个方法跟之前的all用法一样，不同的是数组里面的任意一个异步请求先返回了结果就马上执行第一个回调函数，常用语请求不同服务器的同一样资源，以求达到最快响应速度。