Promise 与async ...await 的使用(更新中...)

• Promise
  对于Promise这个解决回调地狱的好东西,
  需要理解的不仅是用法,更是原理, 有三个状态,就是中间太pending 转向其他态的reject,
  与resolve,的一个中间过程;
  直接console.log()一个Promise可以看出:

Promise {<pending>}
__proto__: Promise
[[PromiseStatus]]: "resolved"
[[PromiseValue]]: Array(2)
0: {text: "搜索结果", value: 1}
1: {text: "搜索结果2", value: 2}
length: 2
__proto__: Array(0)

这里面有两个内部属性,平时我们使用. 或者使用[[]],是访问不到的, 这是,就相当于是吧结果储存在Promise中,这是一个容器,

当我们需要访问的时候就需要,使用then(), 如果失败了,那就使用catch( ),来进行访问,
值得一说的是,then,的第二个参数也是可以接收到catch的错误信息;finally()是不管什么状态都会执行;

---

• async await

先不看概念,直接使用一个 例子
例1 :

async function f() {
  return 'hello world';
}

f().then(v => console.log(v))//直接返回hello world

例2

async function f() {
  // 等同于
  // return 123;
  return await 123;
}

f().then(v => console.log(v))

我们是不是就是使用 async 函数了 (相当在函数前面加一个前缀而而已)

首先我们要明确地是async await 是 Generator函数的语法糖,

而其功能就是吧一步函数直接同步执行,保证顺序执行,

async 函数会返回一个Promise对象, 可以使用then直接来接收,

而 await 是直接后面接一个Promise 的对象, 如果不是的话, 会直接返回结果

function timeout(ms) {
  return new Promise((resolve) => {
    setTimeout(resolve, ms);
  });
}

async function asyncPrint(value, ms) {
  await timeout(ms);
  console.log(value);
}

asyncPrint('hello world', 50);

由于async返回的是Promise对象, 可以作为await的命令参数,

即可以在 new Promise的时候, 也直接写成async await 的形式;

任何一个await语句后面的 Promise 对象变为reject状态，那么整个async函数都会中断执行。

例1

async function f() {
  await Promise.reject('出错了');
  await Promise.resolve('hello world'); // 不会执行
}

为了改变这个处境我们可以使用 try catch 来执行:
例2 :

async function f() {
  try {
    await Promise.reject('出错了');
  } catch(e) {
  	...
  }
  return await Promise.resolve('hello world');
}

f()
.then(v => console.log(v))

可以直接在第一个await后面加上一个 catch 来捕捉错误