通俗易懂的lazyMan,无多层封装,方便新手理解
关于lazyMan,百度这个都会有各种方法
百度的lazyMan都是各种封装,调用,新手不太好理解(作者的封装中容易绕晕)。
所以自己在看了大佬的方法后,自己写了一个面向新手的一个lazyMan的方法。
下面的是自己的
(function () {
var list = []
function f (e) { }
f.prototype.eat = function (e) {
var fn = function () {
console.log('eat | ' + e)
调用() // 这里的调用是一个函数
}
list.push(fn)
return this
}
f.prototype.sleep = function (e) {
var fn = function () {
setTimeout(() => {
console.log('sleep | ' + e)
调用()
}, e * 1000)
}
list.push(fn)
return this
}
f.prototype.firstSleep = function (e) {
var fn = function () {
setTimeout(() => {
console.log('firstSleep | ' + e)
调用()
}, e * 1000)
}
list.unshift(fn)
return this
}
function 调用 () {
if ( list.length > 0 ) {
var fn = list.shift()
fn()
}
}
window.f = function (e) {
var fn = function () {
console.log('lazyman | ' + e)
调用()
}
list.push(fn)
setTimeout(调用, 0)
return new f()
}
})()
// 下面的4行注释一行一行调用,不要4个一起揭开注释
// f("Hank").sleep(2).eat("dinner")
// f("Hank").eat("dinner").eat("supper")
// f("Hank").firstSleep(2).eat("supper")
// f("Hank").sleep(2).firstSleep(3).eat("supper")
下面是自己写的第二个,笨办法
function LazyMan (e) {
var time = 0
, ftime = 0
, timeId
_fn = () => {
timeId = setTimeout(() => {
console.log(e)
}, ftime * 1000)
}
_fn()
return {
sleep (e) {
setTimeout(() => {
time = e
setTimeout( () => {
console.log('Wake up after' + e)
}, (e + ftime) * 1000)
}, 0)
return this
},
eat (e) {
setTimeout(() => {
if ( time || ftime ) {
setTimeout(() => {
console.log('Eat ' + e)
time = 0
}, (time + ftime) * 1000)
} else {
console.log('Eat ' + e)
}
}, 0);
return this
},
sleepFirst (e) {
ftime = e
setTimeout(() => {
console.log('Wake up after ' + e)
}, e * 1000)
if ( timeId ) {
clearTimeout(timeId)
_fn()
}
return this
}
}
}
// LazyMan("Hank").sleep(2).eat("dinner")
// LazyMan("Hank").eat("dinner").eat("supper")
// LazyMan("Hank").sleepFirst(2).eat("supper")
// LazyMan("Hank").sleep(2).sleepFirst(3).eat("supper")