今日笔试错题复盘

361 阅读1分钟

题目如下

实现一个LazyMan,可以按照以下方式调用:
LazyMan(“Hank”)输出:
Hi! This is Hank!

LazyMan(“Hank”).sleep(10).eat(“dinner”)输出
Hi! This is Hank!
//等待10秒..
Wake up after 10
Eat dinner~

LazyMan(“Hank”).eat(“dinner”).eat(“supper”)输出
Hi This is Hank!
Eat dinner~
Eat supper~

LazyMan(“Hank”).sleepFirst(5).eat(“supper”)输出
//等待5秒
Wake up after 5
Hi This is Hank!
Eat supper
以此类推。

这道题主要考察的是闭包,事件轮询机制,链式调用,队列

今天是第一次笔试,准备有点不足哈,个人的问题有以下几点,钻牛角尖了,我一直再考虑的是如何让sleepFirst(5)这个与LazyMan(“Hank”)输出是一样的,但是仅仅是延迟5秒这个怎么实现,并没有考虑到队列的问题。

如果考虑到了队列的问题,那么思路就很快就打开了

实现代码如下:

class _LazyMan {
  constructor(name) {
    //创建一个任务队列
    this.tasks = [];
    //创建一个任务,这个任务执行next()方法
    const task = () => {
      console.log(`Hi! This is ${name}`);
      this.next();
    }
    //把这个任务放入任务队列里去
    this.tasks.push(task);
    // 把 this.next() 放到调用栈清空之后执行
    setTimeout(() => {
      this.next();
    }, 0);
  }

  next () {
    // 取第一个任务执行
    const task = this.tasks.shift();
    task && task();
  }
  //休眠函数
  sleep (time) {
    this._sleepWrapper(time, false);
    return this;                     // 链式调用
  }
  //优先休眠函数
  sleepFirst (time) {
    this._sleepWrapper(time, true);
    return this;
  }
  //休眠函数
  _sleepWrapper (time, first) {
    //创建任务
    const task = () => {
      setTimeout(() => {
        console.log(`Wake up after ${time}`);
        this.next();
      }, time * 1000)
    }
    //判断是否是sleepFirst
    if (first) {
      // 放到任务队列顶部
      this.tasks.unshift(task);     
    } else {
      // 放到任务队列尾部
      this.tasks.push(task);        
    }
  }

  eat (name) {
    //创建一个任务
    const task = () => {
      console.log(`Eat ${name}`);
      this.next();
    }
    this.tasks.push(task);
    return this;
  }
}

function LazyMan (name) {
  return new _LazyMan(name);
}

如果想到了队列,那么此题也很好理解