面試官必問系列之js的鏈式呼叫

2021-10-10 07:50:33 字數 2017 閱讀 8466

使用過jquery的朋友對鏈式呼叫應該都不陌生,形如**:$(ele).show().find().hide(),我們或多或少都見過或者使用過。

但這都是前人已經封裝好的鏈式呼叫,我們只能體會鏈式呼叫帶來的方便,卻不知道形成這樣一條函式鏈的原理是什麼,下面我們就來了解一下鏈式呼叫的原理,並手動實現乙個在面試過程中面試官會經常問的乙個問題。

乙個物件中有多個方法,處於前面的每個方法都返回this,這樣後面的方法就可以繼續this環境下執行,也就是在當前執行環境下執行,實現鏈式呼叫效果。觀察如下**可以更好地理解原理:

let obj =

,sleep

(time)

}obj.

eat(

'lunch').

sleep(5

);//lunch,5

obj.

eat(

'lunch').

eat(

'dinner');

//lunch,dinner

題目描述:實現乙個codingman,可以按照以下方式呼叫:

codingman(『hank』)

輸出:hi!this is hank!

codingman(『hank』).sleep(10).eat(『dinner』)

輸出:hi!this is hank!

//等待10秒

wake up after 10

eat dinner~

codingman(『hank』).eat(『dinner』).eat(『supper』)

輸出:hi!this is hank!

eat dinner~

eat supper~

codingman(『hank』).sleepfirst(5).eat(『supper』)

輸出://等待5秒

wake up after 5

hi!this is hank!

eat supper~

觀察上述題目要求,其實就是我們要實現乙個鏈式呼叫,要實現的方法有eat、sleep、sleepfirst。鏈式呼叫我們已經知道怎麼實現(return this),主要是sleep和sleepfirst方法要實現等待的效果,且sleepfirst的優先順序最高,即它要最先執行,這是題目的難點。

下面是實現的過程(關鍵點:return this + 任務佇列):

//首先定義建構函式codingman

function

codingman

(name)

//函式入隊

this

.queue.

push

(fn)

;settimeout((

)=>,0

);return

this;}

//在codingman的原型上實現eat、sleep、sleepfirst以及輔助方法next

codingman.prototype =

;this

.queue.

push

(fn)

;return

this;}

,sleep

(time)

,time*

1000)}

;this

.queue.

push

(fn)

;return

this;}

,sleepfirst

(time)

,time*

1000)}

;//sleepfirst要優先執行,所以放到佇列首部,

this

.queue.

unshift

(fn)

;return

this;}

,next()

}//測試

newcodingman

('hank').

sleepfirst(5

).eat(

'dinner'

)

面試官常問的設計模式

設計模式分為三大類 建立型模式,共五種 工廠方法模式 抽象工廠模式 單例模式 建造者模式 原型模式。結構型模式,共七種 介面卡模式 裝飾器模式 模式 外觀模式 橋接模式 組合模式 享元模式。行為型模式,共十一種 策略模式 模板方法模式 觀察者模式 迭代子模式 責任鏈模式 命令模式 備忘錄模式 狀態模...

面試官 最愛問的執行緒問題

1 如何停止乙個執行緒 官方停止執行緒的stop方法被廢棄,所以不能直接簡單的停止執行緒。協作的任務執行模式 通知目標執行緒自行結束,而不是強制停止,目標執行緒應當具備處理中斷的能力,中斷方式 interrupt,volatile boolean標誌位 interrupted 是靜態方法,獲取當前執...

面試官都在問 比較類排序系列 堆排序

堆排序是利用堆進行排序的方法。假設進行公升序排序,則它的基本思想是,將待排序的序列構造成乙個大頂堆,這是乙個建堆的過程。此時,整個序列的最大值就是堆頂的根結點。將它與堆陣列的末尾元素交換,此時末尾元素就是最大值,然後將剩餘的n 1個序列,從根開始進行向下調整,重新構造成乙個堆,這樣就會得到n個元素中...