每個JavaScript工程師都要知道的10個面試題
對大部分公司來說,招聘技術人員這種事情,管理層就應該放手交給技術團隊,只有他們才能夠準確地判斷應聘者的技術實力。如果你恰巧是應聘者,你也是遲早都要去面試的。不管你是哪邊的,都讓大哥來教你幾招。
以人為本
在 How to Build a High Velocity Development Team 一文中,我提出了一些觀點,我覺得這些觀點很重要,所以在這里再重復一遍:
優(yōu)秀的團隊才是決定公司業(yè)績的關鍵,一家公司要想于逆境之中仍能有所建樹,最重要的就是得先培養(yǎng)出一只優(yōu)秀的團隊。
就像 Marcus Lemonis 說的,有三點(3 個 P)最重要:
員工(People),流程(Process),產品(Product)。
在創(chuàng)業(yè)初期,你招來的工程師必須是能夠獨當一面的大神隊友。他最好能夠幫著招聘工程師,能指導其它工程師,還能幫初級和中級工程師解決各種問題。這樣優(yōu)秀的隊友,無論何時都多多益善。
要想知道面試應聘者時,有哪些常見的注意事項,可以讀讀 Why Hiring is So Hard in Tech 這篇文章。
要評估一個應聘者的真實水準,最佳方式就是結對編程(pair programming)。
和應聘者結對編程,一切都聽應聘者的。多觀察、多聆聽,看看應聘者是個怎樣的人。用微博的 API 抓取消息并顯示在時間線上,就是個很好的考察應聘者的面試項目。
不過結對編程再好使,也沒辦法讓你完全了解一個應聘者。這個時候,面試也能幫上很多忙——但是千萬別浪費時間去問一些語法(syntax)或者語言上的細節(jié)(language quirks)——問些高端的問題吧,大兄弟。問問項目架構(architecture),編程范式(paradigms),這個層面上的判斷(the big desicions)能夠在很大程度上影響一個項目的成敗。
語法和語言特性(features)這種小知識,Google 一搜一大把,誰都會。而工程師在工作中所積累的軟件工程方面的經驗,以及個人常用的編程范式及代碼風格(idioms),這些可都是很難 Google 到的寶貴財富。
JavaScript 很獨特,它在各種大型項目中都起著至關重要的作用。那是什么讓 JavaScript 如此與眾不同?
下面幾個問題,也許能幫你一探究竟。
1. 能說出來兩種對于 JavaScript 工程師很重要的編程范式么?
JavaScript 是一門多范式(multi-paradigm)的編程語言,它既支持命令式(imperative)/面向過程(procedural)編程,也支持面向對象編程(OOP,Object-Oriented Programming),還支持函數式編程(functional programming)。JavaScript 所支持的面向對象編程包括原型繼承(prototypal inheritance)。
面試加分項
- 原型繼承(即:原型,OLOO——鏈接到其它對象的對象);
- 函數式編程(即:閉包(closure),一類函數(first class functions),lambda 函數:箭頭函數)。
面試減分項
- 連范式都不知道,更別提什么原型 OO(prototypal oo)或者函數式編程了。
深入了解
- The Two Pillars of JavaScript Part 1:JS 兩大支柱之一:原型 OO
- The Two Pillars of JavaScript Part 2:JS 兩大支柱之二:函數式編程
2. 什么是函數式編程?
函數式編程,是將數學函數組合起來,并且避免了狀態(tài)共享(shared state)及可變數據(mutable data),由此而產生的編程語言。發(fā)明于 1958 年的 Lisp 就是首批支持函數式編程的語言之一,而 λ 演算(lambda calculus)則可以說是孕育了這門語言。即使在今天,Lisp 這個家族的編程語言應用范圍依然很廣。
函數式編程可是 JavaScript 語言中非常重要的一個概念(它可是 JavaScript 的兩大支柱之一)。ES5 規(guī)范中就增加了很多常用的函數式工具。
面試加分項
- 純函數(pure functions)/函數的純粹性(function purity)
- 知道如何避免副作用(side-effects)
- 簡單函數的組合
- 函數式編程語言:Lisp,ML,Haskell,Erlang,Clojure,Elm,F#,OCaml,等等
- 提到了 JavaScript 語言中支持函數式編程(FP)的特性:一類函數,高階函數(higher order functions),作為參數(arguments)/值(values)的函數
面試減分項
- 沒有提到純函數,以及如何避免副作用
- 沒有提供函數式編程語言的例子
- 沒有說是 JavaScript 中的哪些特性使得函數式編程得以實現
深入了解
- The Two Pillars of JavaScript Part 2:JS 兩大支柱之二:函數式編程
- The Dao of Immutability
- Composing Software
- The Haskell School of Music
3. 類繼承和原型繼承有什么區(qū)別?
類繼承(Class Inheritance):實例(instances)由類繼承而來(類和實例的關系,可以類比為建筑圖紙和實際建筑 🏠 的關系),同時還會創(chuàng)建父類—子類這樣一種關系,也叫做類的分層分類(hierarchical class taxonomies)。通常是用 new
關鍵字調用類的構造函數(constructor functions)來創(chuàng)建實例的。不過在 ES6 中,要繼承一個類,不用 class
關鍵字也可以。
原型繼承(Prototypal Inheritance):實例/對象直接從其它對象繼承而來,創(chuàng)建實例的話,往往用工廠函數(factory functions)或者 Object.create()
方法。實例可以從多個不同的對象組合而來,這樣就能選擇性地繼承了。
在 JavaScript 中,原型繼承比類繼承更簡單,也更靈活。
面試加分項
- 類:會創(chuàng)建緊密的耦合,或者說層級結構(hierarchies)/分類(taxonomies)。
- 原型:提到了銜接繼承(concatenative inheritance)、原型委托( prototype delegation)、函數繼承(functional inheritance),以及對象組合(object composition)。
面試減分項
- 原型繼承和組合,與類繼承相比,不知道哪個更好。
深入了解
- The Two Pillars of JavaScript Part 1:JS 兩大支柱之一:原型 OO
- Common Misconceptions About Inheritance in JavaScript:對于 JavaScript 中繼承這個概念,所普遍存在的誤解
4. 函數式編程和面向對象編程,各有什么優(yōu)點和不足呢?
面向對象編程的優(yōu)點:關于“對象”的一些基礎概念理解起來比較容易,方法調用的含義也好解釋。面向對象編程通常使用命令式的編碼風格,聲明式(declarative style)的用得比較少。這樣的代碼讀起來,像是一組直接的、計算機很容易就能遵循的指令。
面向對象編程的不足:面向對象編程往往需要共享狀態(tài)。對象及其行為常常會添加到同一個實體上,這樣一來,如果一堆函數都要訪問這個實體,而且這些函數的執(zhí)行順序不確定的話,很可能就會出亂子了,比如競爭條件(race conditions)這種現象(函數 A 依賴于實體的某個屬性,但是在 A 訪問屬性之前,屬性已經被函數 B 修改了,那么函數 A 在使用屬性的時候,很可能就得不到預期的結果)。
函數式編程的優(yōu)點:用函數式范式來編程,就不需要擔心共享狀態(tài)或者副作用了。這樣就避免了幾個函數在調用同一批資源時可能產生的 bug 了。擁有了“無參風格”(point-free style,也叫隱式編程)之類的特性之后,函數式編程就大大簡化了,我們也可以用函數式編程的方式來把代碼組合成復用性更強的代碼了,面向對象編程可做不到這一點。
函數式編程更偏愛聲明式、符號式(denotational style)的編碼風格,這樣的代碼,并不是那種為了實現某種目的而需要按部就班地執(zhí)行的一大堆指令,而是關注宏觀上要做什么。至于具體應該怎么做,就都隱藏在函數內部了。這樣一來,要是想重構代碼、優(yōu)化性能,那就大有可為了。(譯者注:以做一道菜為例,就是由 買菜
-> 洗菜
-> 炒菜
這三步組成,每一步都是函數式編程的一個函數,不管做什么菜,這個流程都是不會變的。而想要優(yōu)化這個過程,自然就是要深入每一步之中了。這樣不管內部如何重構、優(yōu)化,整體的流程并不會變,這就是函數式編程的好處。)甚至可以把一種算法換成另一種更高效的算法,同時還基本不需要修改代碼(比如把及早求值策略(eager evaluation)替換為惰性求值策略(lazy evaluation))。
利用純函數進行的計算,可以很方便地擴展到多處理器環(huán)境下,或者應用到分布式計算集群上,同時還不用擔心線程資源沖突、競爭條件之類的問題。
函數式編程的不足:代碼如果過度利用了函數式的編程特性(如無參風格、大量方法的組合),就會影響其可讀性,從而簡潔度有余、易讀性不足。
大部分工程師還是更熟悉面向對象編程、命令式編程,對于剛接觸函數式編程的人來說,即使只是這個領域的一些的簡單術語,都可能讓他懷疑人生。
函數式編程的學習曲線更陡峭,因為面向對象編程太普及了,學習資料太多了。相比而言,函數式編程在學術領域的應用更廣泛一些,在工業(yè)界的應用稍遜一籌,自然也就不那么“平易近人”了。在探討函數式編程時,人們往往用 λ 演算、代數、范疇學等學科的專業(yè)術語和專業(yè)符號來描述相關的概念,那么其他人想要入門函數式編程的話,就得先把這些領域的基礎知識搞明白,能不讓人頭大么。
面試加分項
- 共享狀態(tài)的缺點、資源競爭、等等(面向對象編程)
- 函數式編程能夠極大地簡化應用開發(fā)
- 面向對象編程和函數式編程學習曲線的不同
- 兩種編程方式各自的不足之處,以及對代碼后期維護帶來的影響
- 函數式風格的代碼庫,學習曲線會很陡峭
- 面向對象編程風格的代碼庫,修改起來很難,很容易出問題(和水平相當的函數式風格的代碼相比)
- 不可變性(immutability),能夠極大地提升程序歷史狀態(tài)(program state history)的可見性(accessible)和擴展性(malleable),這樣一來,想要添加諸如無限撤銷/重做、倒帶/回放、可后退的調試之類的功能的話,就簡單多了。不管是面向對象編程還是函數式編程,這兩種范式都能實現不可變性,但是要用面向對象來實現的話,共享狀態(tài)對象的數量就會劇增,代碼也會變得復雜很多。
面試減分項
- 沒有講這兩種編程范式的缺點——如果熟悉至少其中一種范式的話,應該能夠說出很多這種范式的缺點吧。
深入了解
總是你倆,看來你倆真是非常重要啊。
- The Two Pillars of JavaScript Part 1:JS 兩大支柱之一:原型 OO
- The Two Pillars of JavaScript Part 2:JS 兩大支柱之二:函數式編程
5. 什么時候該用類繼承?
千萬別用類繼承!或者說盡量別用。如果非要用,就只用它繼承一級(one level)就好了,多級的類繼承簡直就是反模式的。這個話題(不太明白是關于什么的……)我也參與討論過好些年了,僅有的一些回答最終也淪為 常見的誤解 之一。更多的時候,這個話題討論著討論著就沒動靜了。
如果一個特性有時候很有用
但有時候又很危險
并且還有另一種更好的特性可以用
那務必要用另一種更好的特性
~ Douglas Crockford
面試加分項
- 盡量別用,甚至是徹底不用類繼承。
- 有時候只繼承一級的話也還是 OK 的,比如從框架的基類繼承,例如
React.Component
。 - 相比類繼承,對象組合(object composition)更好一些。
深入了解
- The Two Pillars of JavaScript Part 1:JS 兩大支柱之一:原型 OO
- JS Objects — Inherited a Mess:JS 對象(繼承):只是繼承了混亂(mess)而已
6. 什么時候該用原型繼承?
原型繼承可以分為下面幾類:
- 委托(delegation,也就是原型鏈)
- 組合(concatenative,比如混用(mixins)、
Object.assign()
) - 函數式(functional,這個函數式原型繼承不是函數式編程。這里的函數是用來創(chuàng)建一個閉包,以實現私有狀態(tài)(private state)或者封裝(encapsulation))
上面這三種原型繼承都有各自的適用場景,不過它們都很有用,因為都能實現組合繼承(composition),也就是建立了 A 擁有特性 B(has-a)、A 用到了特性 B(uses-a) 或者 A 可以實現特性 B(can-do) 的這樣一種關系。相比而言,類繼承建立的是 A 就是 B 這樣一種關系。
面試加分項
- 知道在什么情況下不適合用模塊化(modules)或者函數式編程。
- 知道需要組合多個不同來源的對象時,應該怎么做。
- 知道什么時候該用繼承。
面試減分項
- 不知道什么時候應該用原型。
- 不知道混用和
Object.assign()
。
深入了解
- Programming JavaScript Applications:文章中的“原型”這一節(jié)
7. 為什么說“對象組合比類繼承更好”?
這句話引用的是《設計花紋》(Design Patterns,設計模式)這本書的內容。意思是要想實現代碼重用,就應該把一堆小的功能單元組合成滿足需求的各種對象,而不是通過類繼承弄出來一層一層的對象。
換句話說,就是盡量編程實現 can-do、has-a 或者 uses-a 這種關系,而不是 is-a 這種關系。
面試加分項
- 避免使用類繼承。
- 避免使用問題多多的基類。
- 避免緊耦合。
- 避免極其不靈活的層次分類(taxonomy)(類繼承所產生的 is-a 關系可能會導致很多誤用的情況)
- 避免大猩猩香蕉問題(“你只是想要一根香蕉,結果最后卻整出來一只拿著香蕉的大猩猩,還有整個叢林”)。
- 要讓代碼更具擴展性。
面試減分項
- 沒有提到上面任何一種問題。
- 沒有表達清楚對象組合與類繼承有什么區(qū)別,也沒有提到對象組合的優(yōu)點。
深入了解
8. 雙向數據綁定/單向數據流的含義和區(qū)別
雙向數據綁定(two-way data binding),意味著 UI 層所呈現的內容和 Model 層的數據動態(tài)地綁定在一起了,其中一個發(fā)生了變化,就會立刻反映在另一個上。比如用戶在前端頁面的表單控件中輸入了一個值,Model 層對應該控件的變量就會立刻更新為用戶所輸入的值;反之亦然,如果 Modal 層的數據有變化,變化后的數據也會立刻反映至 UI 層。
單向數據流(one-way data flow), 意味著只有 Model 層才是單一數據源(single source of truth)。UI 層的變化會觸發(fā)對應的消息機制,告知 Model 層用戶的目的(對應 React 的 store
)。只有 Model 層才有更改應用狀態(tài)的權限,這樣一來,數據永遠都是單向流動的,也就更容易了解應用的狀態(tài)是如何變化的。
采用單向數據流的應用,其狀態(tài)的變化是很容易跟蹤的,采用雙向數據綁定的應用,就很難跟蹤并理解狀態(tài)的變化了。
面試加分項
- React 是單向數據流的典型,面試時提到這個框架的話會加分。Cycle.js 則是另一個很流行的單向數據流的庫。
- Angular 則是雙向數據綁定的典型。
面試減分項
- 不理解單向數據流/雙向數據綁定的含義,也說不清楚兩者之間的區(qū)別。
深入了解
9. 單體架構和微服務架構各有何優(yōu)劣?
采用單體架構(monolithic architecture)的應用,各組件的代碼是作為一個整體存在的,組件之間互相合作,共享內存和資源。
而微服務架構(microservice architecture)則是由許許多多個互相獨立的小應用組成,每個應用都有自己的內存空間,應用在擴容時也是獨立于其它應用進行的。
單體架構的優(yōu)勢:大部分應用都有相當數量的橫切關注點(cross-cutting concerns),比如日志記錄,流量限制,還有審計跟蹤和 DOS 防護等安全方面的需求,單體架構在這方面就很有優(yōu)勢。
當所有功能都運行在一個應用里的時候,就可以很方便地將組件與橫切關注點相關聯(lián)。
單體架構也有性能上的優(yōu)勢,畢竟訪問共享內存還是比進程間通信(inter-process communication,IPC)要快的。
單體架構的劣勢:隨著單體架構應用功能的不斷開發(fā),各項服務之間的耦合程度也會不斷增加,這樣一來就很難把各項服務分離開來了,要做獨立擴容或者代碼維護也就更不方便了。
微服務的優(yōu)勢:微服務架構一般都有更好的組織結構,因為每項服務都有自己特定的分工,而且也不會干涉其它組件所負責的部分。服務解耦之后,想要重新組合、配置來為各個不同的應用提供服務的話,也更方便了(比如同時為 Web 客戶端和公共 API 提供服務)。
如果用合理的架構來部署微服務的話,它在性能上也是很有優(yōu)勢的,因為這樣一來,就可以很輕松地分離熱門服務,對其進行擴容,同時還不會影響到應用中的其它部分。
微服務的劣勢:在實際構建一個新的微服務架構的時候,會遇到很多在設計階段沒有預料到的橫切關注點。如果是單體架構應用的話就很簡單,新建一個中間件(shared magic helpers 不知道怎么翻譯……)來解決這樣的問題就行了,沒什么麻煩的。
但是在微服務架構中就不一樣了,要解決這個問題,要么為每個橫切關注點都引入一個獨立的模塊,要么就把所有橫切關注點的解決方案封裝到一個服務層中,讓所有流量都從這里走一遍就行了。
為了解決橫切關注點的問題,雖然單體架構也趨向于把所有的路由流量都從一個外部服務層走一遍,但是在這種架構中,可以等到項目非常成熟之后再進行這種改造,這樣就可以把還這筆技術債的時間盡量往后拖一拖。
微服務一般都是部署在虛擬機或容器上的,隨著應用規(guī)模的不斷增加,虛擬機搶工作(VM wrangling work)的情況也會迅速增加。任務的分配一般都是通過容器群(container fleet)管理工具來自動實現的。
面試加分項
- 對于微服務的積極態(tài)度,雖然初始成本會比單體架構要高一些。知道微服務的性能和擴容在長期看來表現更佳。
- 在微服務架構和單體架構應用上都有實戰(zhàn)經驗。能夠使應用中的各項服務在代碼層面互相獨立,但是又可以在開發(fā)初期迅速地將各項服務打包成一整個的單體架構應用。微服務化的改造可以在應用相當成熟之后,改造成本在可承受范圍內的時候再進行。
面試減分項
- 不知道單體架構和微服務架構的區(qū)別。
- 不知道微服務架構額外的開銷,或者沒有實際經驗。
- 不知道微服務架構中,IPC 和網絡通信所導致的額外的性能開銷。
- 過分貶低微服務。說不清楚什么時候應該把單體架構應用解耦成微服務。
- 低估了可獨立擴容的微服務的優(yōu)勢。
10. 異步編程是什么?又為什么在 JavaScript 中這么重要?
在同步編程中,代碼會按順序自頂向下依次執(zhí)行(條件語句和函數調用除外),如果遇到網絡請求或者磁盤讀/寫(I/O)這類耗時的任務,就會堵塞在這樣的地方。
在異步編程中,JS 運行在事件循環(huán)(event loop)中。當需要執(zhí)行一個阻塞操作(blocking operation)時,主線程發(fā)起一個(異步)請求,(工作線程就會去執(zhí)行這個異步操作,)同時主線程繼續(xù)執(zhí)行后面的代碼。(工作線程執(zhí)行完畢之后,)就會發(fā)起響應,觸發(fā)中斷(interrupt),執(zhí)行事件處理程序(event handler),執(zhí)行完后主線程繼續(xù)往后走。這樣一來,一個程序線程就可以處理大量的并發(fā)操作了。
用戶界面(user interface,UI)天然就是異步的,大部分時間它都在等待用戶輸入,從而中斷事件循環(huán),觸發(fā)事件處理程序。
Node.js 默認是異步的,采用它構建的服務端和用戶界面的執(zhí)行機制差不多,在事件循環(huán)中等待網絡請求,然后一個接一個地處理這些請求。
異步在 JavaScript 中非常重要,因為它既適合編寫 UI,在服務端也有上佳的性能表現。
面試加分項
- 理解阻塞的含義,以及對性能帶來的影響。
- 理解事件處理程序,以及它為什么對 UI 部分的代碼很重要。
面試減分項
- 不熟悉同步、異步的概念。
- 講不清楚異步代碼和 UI 代碼的性能影響,也說不明白它倆之間的關系。
總結
多問問應聘者高層次的知識點,如果能講清楚這些概念,就說明即使應聘者沒怎么接觸過 JavaScript,也能夠在短短幾個星期之內就把語言細節(jié)和語法之類的東西弄清楚。
不要因為應聘者在一些簡單的知識上表現不佳就把對方 pass 掉,比如經典的 CS-101 算法課,或者一些解謎類的題目。
面試官真正應該關注的,是應聘者是否知道如何把一堆功能組織在一起,形成一個完整的應用。
電話面試的注意點就這些了,在線下的面試中,我更加關注應聘者實際編寫代碼的能力,我會觀察他如何寫代碼。在我的《精通 JavaScript 面試》這個系列文章中,會有更深入的描述。