資訊專欄INFORMATION COLUMN
摘要：前言筆者昨天在做某公司的線上筆試題的時(shí)候遇到了最后一道關(guān)于如何實(shí)現(xiàn)的試題，題目如下實(shí)現(xiàn)一個(gè)，可以按照以下方式調(diào)用輸出輸出等待秒輸出輸出等待秒以此類推。
前言
筆者昨天在做某公司的線上筆試題的時(shí)候遇到了最后一道關(guān)于如何實(shí)現(xiàn)LazyMan的試題，題目如下
實(shí)現(xiàn)一個(gè)LazyMan，可以按照以下方式調(diào)用:
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
以此類推。
鑒于時(shí)間的原因只可惜本人當(dāng)時(shí)并沒寫出來，我當(dāng)時(shí)腦海里其實(shí)看到提意就知道要用到隊(duì)列、Promise等異步操作。然后我查閱了網(wǎng)上的資料好像關(guān)于這個(gè)LazyMan的實(shí)現(xiàn)方式倒不少，就說明這道題其實(shí)蠻有意思的，但大多都是關(guān)于Promise或setTimeout的實(shí)現(xiàn)，并沒有Rxjs的實(shí)現(xiàn)方式，所以我就用一些操作符實(shí)現(xiàn)了這個(gè)LazyMan
class LazyManModel {
queue: { timeout: number, fn: Function }[] = []
constructor() {
setTimeout(() => {
from(this.queue).pipe(
map(e => {
if (e.timeout) return of(e).pipe(delay(e.timeout * 1000));
return of(e)
}),
concatAll()
).subscribe(value => {
value.fn()
})
})
}
sleep(time: number): this {
this.queue.push({
timeout: time,
fn: () => { console.log(`Wake up after ${time}`) }
})
return this
}
eat(foot: string): this {
this.queue.push({
timeout: null,
fn: () => { console.log(`Eat ${foot}~`) }
})
return this
}
sleepFirst(time: number): this {
this.queue.unshift({
timeout: time,
fn: () => { console.log(`Wake up after ${time}`) }
})
return this
}
exported(): (name: string) => this {
return (name): this => {
this.queue.push({
timeout: null,
fn: () => { console.log(`Hi! This is ${name}!`) }
})
return this
}
}
}
示例
const LazyMan = new LazyManModel().exported();
LazyMan("Hank").eat("foot").eat("ping").sleep(10).eat("pizza").sleepFirst(5)
關(guān)于setTimeout
我在constructor構(gòu)造函數(shù)里使用了setTimeout是因?yàn)?，在調(diào)用的時(shí)候是鏈?zhǔn)降?，其作用域一直都在同一堆棧，而setTimeout里則是把訂閱的方法放到的最后一個(gè)棧執(zhí)行
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/100917.html
摘要：最后畫幾張粗糙的圖，簡單描述一下這個(gè)執(zhí)行的過程因?yàn)槭擎準(zhǔn)秸{(diào)用，所以在鏈上的都會(huì)入棧然后執(zhí)行，額，執(zhí)行棧少畫了和。。。 前言：昨天在群里討(jin)論(chui)技(niu)術(shù)(pi)，有位老鐵發(fā)了一道他面的某公司面試題，順手保存了。今早花了一點(diǎn)時(shí)間把這題做了出來，發(fā)現(xiàn)挺有意思的，決定在今天認(rèn)真工（hua)作(shui)前，與大家分享我的解題方案和思考過程。 題目如下（可以自己先思考一會(huì)...
摘要：首先我們來講這個(gè)棧在中，每當(dāng)有函數(shù)被執(zhí)行的時(shí)候都會(huì)在當(dāng)前的執(zhí)行堆棧中創(chuàng)建一個(gè)新的堆棧幀，并放到棧頂。因?yàn)槭擎準(zhǔn)秸{(diào)用，所以代碼一直在同一個(gè)作用于中執(zhí)行，也就是說當(dāng)前的堆棧幀一直沒有被移出棧。 前言 前幾天在稀土上看到一篇面試的帖子，里面微信有一道題是lazyman的實(shí)現(xiàn)，具體要做的事情就是 LazyMan(Hank) //Hi! This is Hank! LazyMan(Hank)....
摘要：計(jì)算數(shù)組的極值微信面試題獲取元素的最終前端掘金一題目用代碼求出頁面上一個(gè)元素的最終的，不考慮瀏覽器，不考慮元素情況。 Excuse me？這個(gè)前端面試在搞事！ - 前端 - 掘金金三銀四搞事季，前端這個(gè)近年的熱門領(lǐng)域，搞事氣氛特別強(qiáng)烈，我朋友小偉最近就在瘋狂面試，遇到了許多有趣的面試官，有趣的面試題，我來幫這個(gè)搞事 boy 轉(zhuǎn)述一下。 以下是我一個(gè)朋友的故事，真的不是我。 ... ja...
摘要：前端切圖神器前端掘金安裝前端的基礎(chǔ)工作就是把設(shè)計(jì)師的設(shè)計(jì)稿還原成前端頁面，所以切圖是作為一個(gè)前端的基本技能。 騰訊 Web 工程師的前端書單 - 閱讀 - 掘金作者：link 2014年一月以來，自己接觸web前端開發(fā)已經(jīng)兩年多了，記錄一下自己前端學(xué)習(xí)路上看過的，以及道聽途說的一些書，基本上按照由淺入深來介紹。 JavaScript 入門 《JavaScript權(quán)威指南（第六版）》 ★...
摘要：相反，我們只需要在末尾里找出中的下一個(gè)函數(shù)，再調(diào)用第二個(gè)調(diào)用這個(gè)函數(shù)負(fù)責(zé)找出中的下一個(gè)函數(shù)并執(zhí)行。我們現(xiàn)在來實(shí)現(xiàn)其實(shí)也可以用把拿出來通過去獲取中的函數(shù)，每調(diào)用一次會(huì)加，從而達(dá)到取出下一個(gè)函數(shù)的目的。中大名鼎鼎的框架正是這樣實(shí)現(xiàn)中間件隊(duì)列的。 假設(shè)你有幾個(gè)函數(shù)fn1、fn2和fn3需要按順序調(diào)用，最簡單的方式當(dāng)然是： fn1(); fn2(); fn3(); 但有時(shí)候這些函數(shù)是運(yùn)行時(shí)一個(gè)...
閱讀 3474·2023-04-25 18:52
閱讀 2486·2021-11-22 15:31
閱讀 1225·2021-10-22 09:54
閱讀 3014·2021-09-29 09:42
閱讀 608·2021-09-26 09:55
閱讀 914·2021-09-13 10:28
閱讀 1106·2019-08-30 15:56
閱讀 2111·2019-08-30 15:55
