zoukankan      html  css  js  c++  java
  • promise加载队列实现

    let arr = [1,2,3];

    arr .reduce((promise,current)=>{

      return promise.then(()=>{

        return new Promise(resolve=>{

          setTimeout(()=>{

            console.log(current);

            resolve()

          },1000)

        })

      })

    },Promise.resolve())

    //总结:想要依次加载,上一个promise必须为完成状态,那么.then()里面的内容才可以继续执行,.then()之后的队列想要继续执行,那么当前.then()同样需要返回一个成功状态的promise

    队列渲染示例:

    let data = [
      {
        id:1,
        name:'jay',
        email:'jayking1314@126.com'
      },
      {
        id:2,
        name:'see',
        email:'jayking1314@126.com'
      }
    ]

    function getUser(name){
      return new Promise((resolve,reject)=>{
        let theData = null;
        for(v of data){
          if(v.name === name){
            theData = v;
            break;
          }
        }
        if(theData){
          resolve(theData);
        }
        else{
          reject('no data...')
        }
      })
    }


    class User{
      constructor(name) {
        this.name = name;
      }
      render(users){
        users.reduce((promise,current)=>{
          return promise.then(()=>{
            return getUser(current).then(res=>{
              return this.view(res);
            })
          })
        },Promise.resolve())
      }
      view(user){
        return new Promise(resolve=>{
          setTimeout(()=>{
            let h2 = document.createElement('h2');
            h2.innerHTML = user.name;
            document.body.appendChild(h2);
            resolve();
          },1000)
        })
      }
    }

    new User().render(['jay','see']);

  • 相关阅读:
    Linux指令集
    [日记]贝鲁特煎熬第32天
    2019南京区域赛ABCHJK题解 & KMbfs(O(n^3))板子
    欧拉筛质数以及四大积性数论函数(欧拉函数、莫比乌斯函数、约数个数函数、约数和函数)
    简短的自我介绍
    BSTTreap名次树数组&指针实现板子 Ver1.0
    2019银川区域赛BDFGHIKN题解
    安装vs2010
    SPEmailEventReceiver 之导入附件EXCEL
    为incoming mail绑定事件,SPEmailEventReceiver
  • 原文地址:https://www.cnblogs.com/jayking1314/p/14914340.html
Copyright © 2011-2022 走看看