JS面试题Promise、async、await

1.promise对象

解决回调地狱的办法之一，通过链式调用来解决程序异步执行。
Promise对象有三个状态分别是：pending（等待中）、resolved（已经完成）、rejected（得到结果）
promise的实例方法：
（1）then()得到异步任务的正确结果
（2）.catch()获取异常信息
promise的属性方法：
all()：所有的任务都执行成功结束后调用
allsettled()：所有的方法执行完后调用
any()：有一个.then()成功执行就会调用
race()：有一个.then()执行就会调用
reslove()：根据传递的参数不同返回不同的结果
reject()：返回一个状态为rejectted的promise对象
缺点:无法取消Promise，一旦新建他就会立刻执行，无法中途退出，如果不设置回调函数，Promise内部抛出的错误不会反应到外部，处于pending状态无法知道目前进找到哪一个阶段了。
基本用法：

 <script>
        const p1=new Promise((resolve, reject) => {
    
    
            setTimeout(() => {
    
    
                resolve('成功的数据')
                // reject('失败的数据')
            }, 1000)
        }).then(
            value => {
    
    
                console.log('onResolved()1',value);
            }
        ).catch(
            resaon=>{
    
    
                console.log('onRejected()1',resaon);
            }
        )
    </script>

2.async、await

async函数返回值是一个promise对象，返回的promise的结果是由函数执行的结果决定
是promise链式调用的优化，属于es8语法

<script>
    async function p1(){
    
    
        return new Promise((resolve,reject)=>{
    
    
            setTimeout(()=>{
    
    
                resolve('成功的值')
            },1000);
        })
    }
    const result=p1();
    result,then(
        value=>{
    
    
            console.log('onResovled()',value);
        },
        resaon=>{
    
    
            console.log('onRejected()',reason);
        }
    )
    </script>

await只能写在async函数中
一般用await去等待async函数完成，await 等待的是一个表达式，表达式的计算结果是 promise 对象或其它值，因此，await后面实际可以接收普通函数调用或直接量。
如果await等到的不是promise对象，表达式运算结果就是它等到的东西。
如果是promise对象，await会阻塞后面的代码，等promise对象处理成功，得到的值为await表达式的运算结果。虽然await阻塞了，但await在async中，async不会阻塞，它内部所有的阻塞都被封装在一个promise对象中异步执行。
任何一个await语句后面的 Promise 对象变为reject状态，那么整个async函数都会中断执行。

<script>
        async function p1() {
    
    
            return new Promise((resolve, reject) => {
    
    
                setTimeout(() => {
    
    
                    resolve('成功的值')
                }, 1000);
            })
        }
        const result = p1();
        result.then(
            value => {
    
    
                console.log('onResovled()', value);
            },
            resaon => {
    
    
                console.log('onRejected()', reason);
            }
        )
        function p2() {
    
    
            return new Promise((resolve, reject) => {
    
    
                setTimeout(() => {
    
    
                    resolve('成功的值1')
                }, 1000);
            })
        }
        async function p3() {
    
    
            const value = await p2();//await右侧表达式为promise对象,得到的就是promise成功的值
            //const value= await 函数、数值 await右侧变大时不是promise得到的结果就是它本身的值
            console.log(value);
        }
        p3()
    </script>