promise 与 async awit

promise 与 async awit 是什么

　　promise 通常被定义位：最终会变为可用值的代理。

　　　　是一种异步代码 (解决 “回调” 地狱) 的一种方式

　　　　　　多年来，promise 已成为语言的一部分（在 ES2015 中进行了标准化和引入），并且最近变得更加集成，在 ES2017 中具有了 async 和 await。因此了解 async 与 awit 的基础选了解 promise 的工作方式

promise 怎么运行的：

　　promise 被调用之后，执行回调函数的代码，被创建的 promise 返回解决的装天和失败的状态，以 then 与 catch 进行接收

使用promise：

　　//promise是一个构造函数
        const pr = new Promise((resolve,reject) => {

            //成功是调用 resolve
            // resolve("成功")

            //错误的调用
            throw new Error("错误")
            // reject("错误") 
            
        }).then((res) => {
            console.log(res);
        }).catch(ero =>{
            console.log(ero);
        })

编排promise

　　promise.all()

　　　如果需要同步不同的 promise，则 Promise.all() 可以帮助定义 promise 列表，并在所有 promise 都被解决后执行一些操作。

　　//fetch会返回一个promise对象
        const f1 = fetch('https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata')
        const f2 = fetch('https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata')

        Promise.all([f1, f2])
        .then(res => {
            console.log('结果的数组', res)
        })
        .catch(err => {
            console.error(err)
        })

　　promise.race()

　　  当传给其的首个 promise 被解决时，则 Promise.race() 开始运行，并且只运行一次附加的回调（传入第一个被解决的 promise 的结果）。

　　　　const f1 = new Promise((resolve,reject) =>{
                setTimeout(()=>{
                    resolve("one")
                }, 0);
            })
            const f2 = new Promise((resolve,reject) =>{
                setTimeout(()=>{
                    resolve("two")
                }, 0);
            })

            Promise.race([f1,f2]).then(result => {
                console.log("结果",result);
            })

 

  为什么引入 async/await

　　它们减少了 promises 的样板，且减少了 promise 链的“不破坏链条”的限制。

　　当 ES2015 中引入 Promise 时，它们旨在解决异步代码的问题，并且确实做到了，但是在 ES2015 和 ES2017 断开的两年中，很明显，promise 不可能成为最终的解决方案。

　　Promise 被引入了用于解决著名的回调地狱问题，但是它们自身引入了复杂性以及语法复杂性。

　　它们是很好的原语，可以向开发人员公开更好的语法，因此，当时机合适时，我们得到了异步函数。

　　它们使代码看起来像是同步的，但它是异步的并且在后台无阻塞。

　　

　工作原理

　　异步函数返回promise

let doSomethingAsync = ()=>{
    return new Promise((resolve,reject)=>{
        setTimeOut(()=>{resolve("内容")})
    })
}

　　当要调用此函数时，则在前面加上 await，然后调用的代码就会停止直到 promise 被解决或被拒绝。注：函数必须加上 async 

(async function () {
    console.log(await doSomethingAsync());  //内容
})()

　一个简单的案例

const doSomethingAsync = () => {
  return new Promise(resolve => {
    setTimeout(() => resolve('完成事情'), 3000)
  })
}

const doSomething = async () => {
  console.log(await doSomethingAsync())
}

console.log('之前')
doSomething()
console.log('之后')

结果：
　　之前
　　之后
　　完成事情