Promise及其应用

产生背景：

JS 作为单线程事件循环模型，异步编程可以缩短计算量较大的操作时间，并且可以避开某步操作阻塞线程执行。

早期的异步编程模式是通过定义回调函数来表明异步操作完成。串联多个异步操作需要深度嵌套的回调函数来解决。

介绍：

Promise 是异步编程的一种解决方案：从语法上讲，promise是一个对象，从它可以获取异步操作的消息；从本意上讲，它是承诺，承诺它过一段时间会给你一个结果。promise有三种状态： pending(等待态)，fulfiled(成功态)，rejected(失败态)；状态一旦改变，就不会再变。创造promise实例后，它会立即执行。

作用：解决异步回调的问题

Promise 是一个有状态的对象，通常处于如下3种状态之一：

• 待定（pending）
• 兑现（fulfilled，也称“解决”，resolved）
• 拒绝（rejected）

pending 是 Promise 的初始状态。在待定状态下，可以选定为 fulfilled 状态，或者 rejected 状态，之后不可改变。Promise 的状态也不能被外部 JS 代码修改。这与无法读取该状态的原因相同：封装异步行为，从而隔离外部的同步代码。

使用：

new Promise()构造器可以用在传统的异步任务中，就像以前 setTimeout 和 XMLHttpRequest 的用法一样。一个新的 Promise 使用 new 关键字生成，同时，这个 Promises 提供了 resolve 和 reject 函数让我们执行回调操作

var p = new Promise((resolve, reject) => {
        if (true) {
          resolve("Success!");
        } else {
          reject("Failure");
        }
      });
      p.then(() => {
        /*do something with the result*/
      }).catch(() => {
        /*error*/
      });

Promise.resolve() 和 Promise.reject() 可以直接被调用。有时候，当判断出 promise 并不需要真正执行时，我们并不需要 使用 new 创建 Promise 对象，而是可以直接调用 Promise.resolve() 和 Promise.reject()。比如：

var userCache = {};
    function getUserDetail(username) {
     if (userCache[username]) {
          return Promise.resolve(userCache[username]);
     }
     return fetch("users/" + username + ".json")
          .then((result) => {
            userCache[username] = result;
            return result;
          })
          .catch(() => {
            throw new Error("Could not find user:" + username);
          });
      }

async/await的作用与用法

---

• async

  async 是“异步”的简写， async 用于申明一个异步的 function

• await

  await 可以认为是 async wait 的简写，await 用于等待一个异步方法执行完成。

async function demoFunc () {
  return new Promise((resolve,  reject) => {
    resolve('hello world')
  })
}

如果返回值不是一个promise对象会强制成一个promise对象

基本使用：

function printName(name) {
  return new Promise((resolve, reject) => {
      setTimeout(() => {
          resolve(name)
      }, 2000)
  } )
}

async function getName() {
  let name = await printName('jack')
  console.log('hello ', name)
}
getName() // 2s后 输出hello jack 

代码的执行过程是调用了getName方法，遇到了await，await表示代码在这里暂停了，不再向下执行，等待promise对象执行完毕，拿到promise resolve的值并返回后，再继续向下执行。