实现一个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”).eat(“supper”).sleepFirst(5)输出
//等待5秒
Wake up after 5
Hi This is Hank!
Eat supper
/* 分析思路:
1,实现链式调用,可调用方法 都会返回 this 也就是 new 出来的实例对象;
2,实现延迟调用;
3,可自定义任务优先调用
*/
class LazyMan {
constructor(name) {
this.tasks = []
const task = () => {
console.log('Hi! This is ' + name)
this.next()
}
this.tasks.push(task)
// 重点,下一次需执行的宏任务,触发任务入口
setTimeout(() => {
this.next()
}, 0)
}
// next ??? 依次执行任务队列中的任务
next() {
const task = this.tasks.shift()
task && task()
}
sleep(time) {
this._sleepWrapper({ time, isFirst: false })
return this
}
sleepFirst(time) {
this._sleepWrapper({ time, isFirst: true })
return this
}
_sleepWrapper({time, isFirst}) {
const task = () => {
setTimeout(() => {
console.info('Wake up after ' + time)
this.next()
}, time * 1000)
}
if(isFirst) {
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)
}
// lazyMan("Hank")
// lazyMan("Hank").sleep(2).eat("dinner")
// lazyMan("Hank").eat("dinner").eat("supper")
lazyMan("Hank").eat("supper").sleepFirst(3)