jsはチェーン式の呼び出しを実現し、実行イベント、フロー制御を加えます.

var p = new Queue();
p.task(1000, () => {
  console.log(1);
}).task(2000, () => {
  console.log(2);
}).task(6000, () => {
  console.log(6);
})

上記のクラスを実現し、設定したタスクを設定時間通りに順次実行します.

function Queue() {
  this.arr = [];
  setTimeout(() => {
    this.next();
  }, 0)
  return this
}
Queue.prototype.next = function () {
  let fn = this.arr.shift();
  fn && fn()
}
Queue.prototype.task = function (timer, fun) {
  let that = this;
  let fn = () => {
    new Promise(resolve => {
      setTimeout(() => {
        that.next();
        resolve()
      }, timer)
    }).then(res => fun())

  }
  this.arr.push(fn);
  return this;
}

この中でチェーン式の呼び出しを実現し、上流工程の制御を加えます.

function Test(name) {
  this.task = [];
  let fn = () => {
    console.log(name);
    //  this.next()      
    this.next();
  }
  this.task.push(fn);
  //            next，   next  setTimeout ，      script   ，              this.next()
  setTimeout(() => {
    this.next();
  }, 0)
  return this;
}

Test.prototype.firstSleep = function (timer) {
  console.time("firstSleep")
  let fn = () => {
    setTimeout(() => {
      console.timeEnd("firstSleep");
      this.next();
    }, timer * 1000)
  }
  //          ，        
  this.task.unshift(fn);
  return this;
}

Test.prototype.sleep = function (timer) {
  console.time("sleep")
  let fn = () => {
    setTimeout(() => {
      console.timeEnd("sleep");
      this.next();
    }, timer * 1000)
  }
  this.task.push(fn);
  return this;
}

Test.prototype.eat = function (dinner) {
  let fn = () => {
    console.log(dinner);
    this.next();
  }
  this.task.push(fn);
  return this;
}

Test.prototype.next = function () {
//         
  let fn = this.task.shift();
  //       
  fn && fn()
}

new Test("test").firstSleep(3).sleep(5).eat("dinner")

その中の理解の考え方は、1、チェーンコールはリターンthis 2、フロー制御はタスクキューを使って、自分で作成します.
ブログのリンクを参照:https://blog.csdn.net/qq_37653449/articale/detail/83933724