zoukankan      html  css  js  c++  java
  • Promise如何解决回调地狱

    为什么要有promise:解决(回调地狱)的问题

    ### 回调地狱:

    ```js //跟以前的if条件地狱很像

    // if(){ // if(){ // if(){ // } // } //}

    $.get("/getUser",function(res){

      $.get("/getUserDetail",function(){

         $.get("/getCart",function(){

           $.get("/getBooks",function(){ //...

           })

         })

       })

    })

    //node开发:读取文件;开个服务器、接收一个请求、请求路径、访问数据库 ```

    ### Promise函数基本用法
    ```js
    var promise=new Promise((resolve,reject)=>{
      //b 把需要执行的异步操作放在这里
      $.get("/getUser",res=>{
        //获取数据的异步操作已经执行完毕了,等待下一步的执行,通过执行resolve函数,告诉外界你可以执行下一步操作了
        //c、

        resolve(res) //只是一个标记
        //而执行的下一步操作,其实就是写在then的回调函数中的
      })
    })


    //a、
    promise.then(res=>{
      //d、执行后续的操作
      console.log(res);
    })
    ```

        //把异步操作封装在一个promise对象中
        function fn(){
            return new Promise((resolve,reject)=>{
                setTimeout(()=>{
                    console.log('你好');
    
                    //其实异步逻辑到这里其实已经执行完毕了,
                    //就可以告诉外界,可以执行其他操作了
                    //如何告诉外界,让外界得知?
                    resolve();
                },1000);
            })
        }
        //调用了这个函数,执行了异步操作
        //fn()
        //存在问题,并不知道这个异步操作什么时候结束
        fn().then(res=>{
            //执行到下一步
            console.log("下一步");
    
            fn().then(res=>{
                console.log("执行第二步");
            })
        })
    
        //输出顺序:
        //你好
        //下一步
        //你好
        //执行第二步
     function f1(){
            return new Promise(resolve=>{
                setTimeout(()=>{
                    console.log('第一步');
                    
                    //异步逻辑已经执行完,必须要告诉外界我执行完了
                    resolve();
    
                },1000)
            })
        }
        function f2(){
            return new Promise(resolve=>{
                setTimeout(()=>{
                    console.log('第二步');
                    
                    //告诉外界我执行完了
                    resolve();
                },1000)
            })
        }
    
        f1().then(res=>{
            //返回一个promise对象,然后链式调用then方法
            return f2();
        }).then(res=>{
            return f1();
        }).then(res=>{
            return f2();
        }).then(res=>{
            setTimeout(()=>{
                console.log('完成');
            },1000)
        })
  • 相关阅读:
    ThinkPHP 3.2.2 实现持久登录 ( 记住我 )
    Java实现 LeetCode 20 有效的括号
    Java实现 LeetCode 20 有效的括号
    Java实现 LeetCode 19删除链表的倒数第N个节点
    Java实现 LeetCode 19删除链表的倒数第N个节点
    Java实现 LeetCode 19删除链表的倒数第N个节点
    Java实现 LeetCode 18 四数之和
    Java实现 LeetCode 18 四数之和
    Java实现 LeetCode 18 四数之和
    Java实现 LeetCode 17 电话号码的字母组合
  • 原文地址:https://www.cnblogs.com/lguow/p/11315374.html
Copyright © 2011-2022 走看看