promise+await解决js中异步任务返回值的问题

1. 问题场景

完成一个简单的登录注册功能。前端react+后台koa2+MySQL数据库。因为登录和注册的业务流程差不多，我就拿登录举一个例子。用户输入username和password，将这两个参数通过get的方式传递给后台，后台使用router.get方式接受这两个参数，再查询数据库中是否有该用户相关信息，有的话返回前台登录成功，没有返回前台登陆失败。

2. 出现问题

数据库查询connection.query（）是异步的。我想要根据不同的查询结果向前台返回不同的响应，但是因为异步任务调皮的特点，还没有等到查询结果就会给前台返回响应（不写响应还会404，就很离谱！）
问题代码类似于这样（原来的忘了）

module.exports = ctx=>{
  var mysql = require('mysql');
  var connection = mysql.createConnection({
    host: 'localhost',
    user: 'root',
    password: 'wxb7e2f16d9e113148',
    database: 'yhytest'
  });
  connection.connect();
  var a='ini';
  var sql = 'SELECT * FROM yhytesttable';
  //查询数据库
  connection.query(sql, function (err, result) {
    if (err) {
      a = err.message;
      return;
    }
    a = result["0"].name;
  });
  ctx.state.data = {
    msg: a
  }
}

为了解决这个问题引出promise和await

3. promise

promise类似于一个容器，里面装着一个异步任务，利用promise可以获取异步任务的信息。

new Promise((resolve,reject)=>{
  // 里面是一个异步任务
  resolve（）；// 异步任务成功了进行它
  reject（）；// 异步任务失败了进行它
});

Promise的构造函数里直接传入了一个function，我们可以称呼它为executor，它有两个函数参数resolve，reject。当上面这行语句执行的时候，executor会立即异步执行。在executor方法的方法体内，你可以写你自己的代码逻辑，你可以在代码的正常执行逻辑里调用resolve（retValue）来把Promise的status改为resolved，表示任务执行成功；在出错异常处理的代码里调用reject（err）来把Promise的status改为rejected，表示任务执行失败。也就是说，executor函数的执行成功还是失败，是可以从Promise的状态里判断出来的。这里要注意两点:

Promise从pending状态改为resolved或rejected状态只会有一次，一旦变成resolve或rejected之后，这个Promise的状态就再也不会改变了。
通过resolve(retValue)传入的retValue可以是任何值，null也可以，它会传递给后面的then方法里的function去使用。通过rejected（err）传入的err理论上也是没有限制类型的，但我们一般都会传入一个Error，比如reject(new Error(“Error”))。promise的状态可以影响后面then的执行。

new Promise((resolve,reject)=>{
  resolve(value);
  reject(error);
}).then((value)=>{
  return 一个promise实例；
})

内容参考：浅析JS中的 promise+await/async

4. async/await

async/await使得异步代码看起来像同步代码，但是改变不了JS单线程、异步的本质。await就是等一等吗，等等await后面的异步任务执行完成之后，再进行它之后的代码的运行。
用法：

使用await，函数必须用async标识
await后面跟的是一个Promise实例

// user.js
function userLogin(name, password) {
  // 处理异步任务返回的results
  return new Promise((resolve, reject) => {});
}

// index.js
router.get("/login", async (req, res) => {
  var name = req.query.userName;
  var pwd = req.query.userPwd;
  // await处理异步任务results，根据不同results情况向前台返回不同响应
  let results = await userLogin(name, pwd);
  if (results.length == 1) {
    req.body = "登陆成功！";
  } else {
    req.body = "登陆失败！请重新登陆！";
  }
});

index.js中的await就会让userLogin执行，而不是不等执行直接进行req.body

内容参考：异步解决方案----Promise与Await
先写到这，想起来别的了继续写...

最后编辑于：2020.11.06 09:48:03