一、callBack 回调函数方式

通过传入回调方法获取异步数据

function fun1(callBack){
  setTimeout(() =>{
    callBack("返回结果")
  },1000)
}
//传入方法
fun1((res) =>{
  //打印出“返回结果”字符串
  console.log(res)
})

二、Promise方式

Promise 有三种状态：

1. pending：“正在执行中” 可转换为以下两个状态，只能返回其中一个状态，并且改变后状态不可逆。
2. resolve：“返回成功”， 使用.then接收。
3. reject： “返回失败”， 使用.catch接收。

function fun1(){
  //必须返回Promise
  return new Promise((resolve,reject)=>{
    setTimeout(() =>{
      resolve("成功")
      //reject("失败")
    },1000)
  })
}
fun1().then((res)=>{
  //返回结果为：“成功结果:成功”
  console.log("成功结果:" + res)
}).catch((reject)=>{
  //如果通过reject返回 返回结果为：“失败结果:失败”
  console.log("失败结果:" + reject)
})

Promise.all([fun1(),fun2(),fun3()]) 传入参数为数组形式，数组中是每一个异步方法。

用于处理多个异步方法变为按参数顺序同步执行，必须等数组中的每一个方法都执行完以后，才返回成功/失败。

function fun1(){
  return new Promise((resolve,reject)=>{
    setTimeout(() =>{
     resolve("fun1返回成功")
    },1000)
  })
}
function fun2(){
  return new Promise((resolve,reject)=>{
    setTimeout(() =>{
     resolve("fun2返回成功")
     //reject("fun2返回失败")
    },1000)
  })
}
function fun3(){
  return new Promise((resolve,reject)=>{
    setTimeout(() =>{
     resolve("fun3返回成功")
    },1000)
  })
}
Promise.all([fun1(),fun2(),fun3()]).then((res)=>{
  //若全部为resolve返回成功，打印结果为： ['fun1返回成功', 'fun2返回成功', 'fun3返回成功']
  console.log(res)
}).catch((reject)=>{
  //若其中有一个返回reject失败，则只返回第一次reject的信息 例如：放开fun2中reject注释 打印结果为：fun2返回失败
  console.log(reject)
})

三、async/awite方式

async 可以单独使用 并且返回的是promise，await 必须配合async使用 不然会报错。

function fun1(){
  return new Promise((resolve,reject)=>{
    setTimeout(() =>{
      resolve("成功")
    },2000)
  })
}
(async function getData(){
  //输出: "fun1执行前"
  console.log("fun1执行前")
  const res = await fun1()
  //两秒后输出: "返回结果：成功" 和 "fun1返回结果后"
  console.log("返回结果："+res)
  console.log("fun1返回结果后")
})()