设计一个LazyMan类

今天看到一个面试题，设计LazyMan类实现以下功能

LazyMan('Tony');
// Hi I am Tony

LazyMan('Tony').sleep(10).eat('lunch');
// Hi I am Tony
// 等待了10秒...
// I am eating lunch

LazyMan('Tony').eat('lunch').sleep(10).eat('dinner');
// Hi I am Tony
// I am eating lunch
// 等待了10秒...
// I am eating diner

LazyMan('Tony').eat('lunch').eat('dinner').sleepFirst(5).sleep(10).eat('junk food');
// Hi I am Tony
// 等待了5秒...
// I am eating lunch
// I am eating dinner
// 等待了10秒...
// I am eating junk food

1. 通过同步任务把所有函数用数组装起来，最后在异步微任务里遍历依次调用，有异步的任务通过async await 等待

class LazyMan {
  handlers = []
  constructor (name) {
    console.log(`Hi I am ${name}`)
    this.runner()
  }

  runner () {
    Promise.resolve().then(async res => {
      while (this.handlers.length) {
        await this.handlers.shift()()
      }
    })
    return this
  }

  wait (second) {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log(`等待了${second}秒`)
        resolve()
      }, second * 1000)
    })
  }

  eat (action) {
    this.handlers.push(() => {
      console.log(`I am eating ${action}`)
      return Promise.resolve()
    })
    return this
  }

  sleepFirst (second) {
    this.handlers.unshift(() => this.wait.call(this, second))
    return this
  }

  sleep (second) {
    this.handlers.push(() => this.wait.call(this, second))
    return this
  }
}

2. 链式调用，同样是数组装下所有函数，最后在函数各自回调里依次打印

class LazyMan {
  handlers = []
  constructor (name) {
    console.log(`Hi I am ${name}`)
    this.runner()
  }

  runner () {
    Promise.resolve().then(() => {
      this.next.call(this)
    })
    return this
  }

  next () {
    this.handlers.length && this.handlers.shift()()
  }

  wait (second) {
    return setTimeout(() => {
        console.log(`等待了${second}秒`)
        this.next()
      }, second * 1000)
  }

  eat (action) {
    this.handlers.push(() => {
      console.log(`I am eating ${action}`)
      this.next()
    })
    return this
  }

  sleepFirst (second) {
    this.handlers.unshift(() => {
      this.wait.call(this, second)
    })
    return this
  }

  sleep (second) {
    this.handlers.push(() => {
      this.wait.call(this, second)
    })
    return this
  }
}

最后调用试一试

new LazyMan('Tony').eat('lunch').eat('dinner').sleepFirst(5).sleep(10).eat('junk food')