异步处理（前端面试）

Promise

1：使用promise原因

了解回调地狱【什么是回调地狱】
1：回调地狱是异步获取结果后，为下一个异步函数提供参数，层层回调嵌入回调
2：导致回调层次很深，代码维护特别困难
3：在没有ES6时，是将每一个request【网络请求】封装成一个函数将结果进行返回

promise解决问题
1：promise解决异步方法，本质上是一个构造函数，可以用它来实例化一个对象
2：对象身上有resolve，reject，all原型上有then，catch方法
3：promise对象有三种状态：
	（1）pending（初始化状态|进行中）
	（2）resolved|fulfilled（成功状态）
	（3）rejected（失败）

promise三种状态
（1）pending
	它的意思是 “待定的，将发生的”，相当于是一个初始状态。创建Promise对象时，且没有调用resolve或者是reject方法，相当于是初始状态。这个初始状态会随着你调用resolve，或者是reject函数而切换到另一种状态。
（2）resolved
	表示解决了，就是说这个承诺实现了。 要实现从pending到resolved的转变，需要在 创建Promise对象时，在函数体中调用了resolve方法 。
（3）rejected
	拒绝，失败。表示这个承诺没有做到，失败了。要实现从pending到rejected的转换，只需要在创建Promise对象时，调用reject函数。

2：代码

//promise链式调用
this.getNav().then(res=>{
  let id=res.data[0].id;
  return this.getArticle(id);
}).then(res=>{
  let id=res.data[0].id;
  return this.getComment(id)
}).then(res=>{
  console.log(res)
}) 

methods: {
    //先获取导航分类接口，将结果进行返回，到调用函数的地方获取
    getNav(callback){
      return new Promise((resolve,reject)=>{
        uni.request({
          url:"https://ku.qingnian8.com/dataApi/news/navlist.php",
          success:res=>{
            resolve(res)
          },
          fail:err=>{
            reject(err)
          }
        })
      })
    },


    //获取文章数据，将文章列表进行返回
    getArticle(id){
      return new Promise((resolve,reject)=>{
        uni.request({
          url:"https://ku.qingnian8.com/dataApi/news/newslist.php",
          data:{
            cid:id
          },
          success:res=>{
            resolve(res)
          },
          fail:err=>{
            reject(err)
          }
        })
      })
    },

      //获取文章下的所有评论
      getComment(id){
        return new Promise((resolve,reject)=>{
          uni.request({
            url:"https://ku.qingnian8.com/dataApi/news/comment.php",
            data:{
              aid:id
            },
            success:res=>{
              resolve(res)
            },
            fail:err=>{
              reject(err)
            }
          })
        })
} 

async | await异步处理同步化

1：使用概念

1：async|await是成对出现
2：只使用await而函数中没有使用async命令，会出现报错
3：直接使用async命令，没有使用await，返回的函数是一个promise【没有实际意义】
4：async修饰函数，await是添加在调用函数的部分前
	该命令的含义是：得等这一行异步方法执行成功后，将返回值赋值给res变量，才可以走下一行代码
5：将原来的异步编程改为同步编程【异步处理同步化】

2：代码

async onLoad() {
  let id,res;
  res=await this.getNav();
  id=res.data[0].id;
  res=await this.getArticle(id);
  id=res.data[0].id;
  res=await this.getComment(id);
  console.log(res)
} 

3：同步与异步

同步
1：js代码实际上是单线程程序，代码按顺序一行一行执行
2：如果在同步编程中发送网络请求【请求超时】，下面代码依赖网络请求，那么整个网页会失去响应

异步
1：一个异步过程的执行不在于原有的序列顺序有关
2：发送网络请求【不确定响应时间，异步是最优选】，程序不在此等待，直接走下面代码，等异步请求有响应，自主完成回调后续操作，程序之间互不影响

ps
	（1）同步按顺序执行，异步不按顺序执行，异步执行效率高
	（2）如果涉及到网络请求没有依赖关系的话，异步请求是效率最高的，但是下一个的方法依赖于上一个网络请求的结果，那么久必须使用await命令，将异步结果等待返回之后再执行后面的代码。