关于Promise以及其配合async、await使用(测试代码)


//------- 异步执行后有数据没有获取到 -------//
        function tea(){
            setTimeout(() => {
                //------- 直接调用 -------//
                return '获得奶茶!'
            }, 2000);
        }
        function hotPot(){
            setTimeout(() => {
                //------- 直接调用 -------//
                return '获得火锅!'
            }, 3000);
        }
        function go(){
            //------- 直接调用,undefined -------//
            console.log('tea :>> ', tea());         //tea :>> undefined
            console.log('hotPot :>> ', hotPot());   //hotPot :>> undefined
        }

        //------- tea_fn -------//
        function tea_fn(fn) {
            setTimeout(() => {
                //------- 传入函数,利用回调函数 -------//
                fn('获得奶茶!')
            }, 2000);
        }
        function hotPot_fn(fn) {
            setTimeout(() => {
                //------- 传入函数,利用回调函数 -------//
                fn('获得火锅!')
            }, 3000);
        }
        function go_fn() {
            //------- 回调函数,延时过后显示数据 -------//
            tea_fn((data) => {
                console.log('tea_fn :>> ', data); //2秒后 tea_fn :>> 获得奶茶!
            })
            hotPot_fn((data) => {
                console.log('hotPot_fn :>> ', data); //3秒后 hotPot_fn :>> 获得火锅!(上方函数1秒后)
            })

            //------- 回调嵌套,想先吃火锅在点奶茶 -------//
            hotPot_fn((data) => {
                console.log('hotPot_fn回调嵌套 :>> ', data); //2秒后 tea_fn :>> 获得奶茶!
                tea_fn((data) => {
                    console.log('tea_fn回调嵌套 :>> ', data);//3秒后 hotPot_fn :>> 获得火锅!(上层函数1秒后)
                })
            })
        }

        //------- 利用promise -------//
        var tea_flag = true;
        var hotPot_flag = true;
        var tea_Pms = new Promise((resolve, reject) => {
            setTimeout(() => {
                if (tea_flag) {
                    resolve('获得奶茶!');
                } else {
                    reject('获得奶茶失败');
                }

            }, 2000);
        });
        var hotPot_Pms = new Promise((resolve, reject) => {
            setTimeout(() => {
                if (hotPot_flag) {
                    resolve('获得火锅!');
                } else {
                    reject('获得火锅失败');
                }

            }, 3000);
        })

        function go_pms() {        
            //------- 利用promise -------//
            tea_Pms
                .then((data) => {
                    console.log('tea_pms :>> ', data);
                })
                .catch((data) => {
                    console.log('tea_err_pms :>> ', data);
                })
            hotPot_Pms
                .then((data) => {
                    console.log('hotPot_pms :>> ', data);
                })
                .catch((data) => {
                    console.log('hotPot_err_pms :>> ', data);
                })

            //------- Promise链式调用 -------//
            hotPot_Pms
                .then((data) => {
                    console.log('hotPot_pms链式调用 :>> ', data);
                    return tea_Pms
                }).catch((data) => {
                    console.log('hotPot_err_pms链式调用 :>> ', data);
                    return tea_Pms
                })
                .then((data) => { //这里相当于 tea_Pms.then ,因为上面return了 tea_Pms
                    console.log('tea_pms链式调用 :>> ', data);
                }).catch((data) => {
                    console.log('tea_err_pms链式调用 :>> ', data);
                })
        }

        async function go_async() {
            try {
                let tea_res = await tea_Pms;
                console.log('tea_async :>> ', tea_res);
            } catch (error) {
                console.log('error_async :>> ', error);
            }

            try {
                let hotPot_res = await hotPot_Pms;
                console.log('hotPot_async :>> ', hotPot_res);
            } catch (error) {
                console.log('error_async :>> ', error);
            }

        }