每個JavaScript工程師都應當知道的10個面試題

對大部分公司來說，招聘技術人員這種事情，管理層就應該放手交給技術團隊，只有他們才能夠準確地判斷應聘者的技術實力。如果你恰巧是應聘者，你也是遲早都要去面試的。不管你是哪邊的，都讓大哥來教你幾招。

以人為本

在Howto Build a High Velocity Development Team一文中，我提出了一些觀點，我覺得這些觀點很重要，所以在這裡再重複一遍：

優秀的團隊才是決定公司業績的關鍵，一家公司要想於逆境之中仍能有所建樹，最重要的就是得先培養出一隻優秀的團隊。

就像MarcusLemonis 說的，有三點（3個P）最重要：

員工（People），流程（Process），產品（Product）。

在創業初期，你招來的工程師必須是能夠獨當一面的大神隊友。他最好能夠幫著招聘工程師，能指導其它工程師，還能幫初級和中級工程師解決各種問題。這樣優秀的隊友，無論何時都多多益善。

要想知道面試應聘者時，有哪些常見的注意事項，可以讀讀WhyHiring is So Hard in Tech這篇文章。

要評估一個應聘者的真實水準，最佳方式就是結對編程（pairprogramming）。

和應聘者結對編程，一切都聽應聘者的。多觀察、多聆聽，看看應聘者是個怎樣的人。用微博的API抓取消息並顯示在時間線上，就是個很好的考察應聘者的面試項目。

不過結對編程再好使，也沒辦法讓你完全瞭解一個應聘者。這個時候，面試也能幫上很多忙——但是千萬別浪費時間去問一些語法（syntax）或者語言上的細節（languagequirks）——問些高端的問題吧，大兄弟。問問項目架構（architecture），編程範式（paradigms），這個層面上的判斷（thebig desicions）能夠在很大程度上影響一個項目的成敗。

語法和語言特性（features）這種小知識，Google一搜一大把，誰都會。而工程師在工作中所積累的軟件工程方面的經驗，以及個人常用的編程範式及代碼風格（idioms），這些可都是很難Google到的寶貴財富。

JavaScript很獨特，它在各種大型項目中都起著至關重要的作用。那是什麼讓JavaScript如此與眾不同？

下面幾個問題，也許能幫你一探究竟。

1.能說出來兩種對於JavaScript工程師很重要的編程範式麼？

JavaScript是一門多範式（multi-paradigm）的編程語言，它既支持命令式（imperative）/面向過程（procedural）編程，也支持面向對象編程（OOP，Object-OrientedProgramming），還支持函數式編程（functionalprogramming）。JavaScript所支持的面向對象編程包括原型繼承（prototypalinheritance）。

面試加分項

• 原型繼承（即：原型，OLOO——鏈接到其它對象的對象）；
• 函數式編程（即：閉包（closure），一類函數（firstclass functions），lambda函數：箭頭函數）。

面試減分項

• 連範式都不知道，更別提什麼原型OO（prototypaloo）或者函數式編程了。

深入瞭解

2.什麼是函數式編程？

函數式編程，是將數學函數組合起來，並且避免了狀態共享（sharedstate）及可變數據（mutabledata），由此而產生的編程語言。發明於1958年的Lisp就是首批支持函數式編程的語言之一，而λ演算（lambdacalculus）則可以說是孕育了這門語言。即使在今天，Lisp這個家族的編程語言應用範圍依然很廣。

函數式編程可是JavaScript語言中非常重要的一個概念（它可是JavaScript的兩大支柱之一）。ES5規範中就增加了很多常用的函數式工具。

面試加分項

• 純函數（purefunctions）/函數的純粹性（functionpurity）
• 知道如何避免副作用（side-effects）
• 簡單函數的組合
• 函數式編程語言：Lisp，ML，Haskell，Erlang，Clojure，Elm，F#，OCaml，等等
• 提到了JavaScript語言中支持函數式編程（FP）的特性：一類函數，高階函數（higherorder functions），作為參數（arguments）/值（values）的函數

面試減分項

• 沒有提到純函數，以及如何避免副作用
• 沒有提供函數式編程語言的例子
• 沒有說是JavaScript中的哪些特性使得函數式編程得以實現

深入瞭解

3.類繼承和原型繼承有什麼區別？

類繼承（ClassInheritance）：實例（instances）由類繼承而來（類和實例的關係，可以類比為建築圖紙和實際建築new關鍵字調用類的構造函數（constructorfunctions）來創建實例的。不過在ES6中，要繼承一個類，不用class關鍵字也可以。

原型繼承（PrototypalInheritance）：實例/對象直接從其它對象繼承而來，創建實例的話，往往用工廠函數（factoryfunctions）或者Object.create()方法。實例可以從多個不同的對象組合而來，這樣就能選擇性地繼承了。

在JavaScript中，原型繼承比類繼承更簡單，也更靈活。

面試加分項

• 類：會創建緊密的耦合，或者說層級結構（hierarchies）/分類（taxonomies）。
• 原型：提到了銜接繼承（concatenativeinheritance）、原型委託（prototypedelegation）、函數繼承（functionalinheritance），以及對象組合（objectcomposition）。

面試減分項

深入瞭解

4.函數式編程和麵向對象編程，各有什麼優點和不足呢？

面向對象編程的優點：關於“對象”的一些基礎概念理解起來比較容易，方法調用的含義也好解釋。面向對象編程通常使用命令式的編碼風格，聲明式（declarativestyle）的用得比較少。這樣的代碼讀起來，像是一組直接的、計算機很容易就能遵循的指令。

面向對象編程的不足：面向對象編程往往需要共享狀態。對象及其行為常常會添加到同一個實體上，這樣一來，如果一堆函數都要訪問這個實體，而且這些函數的執行順序不確定的話，很可能就會出亂子了，比如競爭條件（raceconditions）這種現象（函數A依賴於實體的某個屬性，但是在A訪問屬性之前，屬性已經被函數B修改了，那麼函數A在使用屬性的時候，很可能就得不到預期的結果）。

函數式編程的優點：用函數式範式來編程，就不需要擔心共享狀態或者副作用了。這樣就避免了幾個函數在調用同一批資源時可能產生的bug了。擁有了“無參風格”（point-freestyle，也叫隱式編程）之類的特性之後，函數式編程就大大簡化了，我們也可以用函數式編程的方式來把代碼組合成複用性更強的代碼了，面向對象編程可做不到這一點。

函數式編程更偏愛聲明式、符號式（denotationalstyle）的編碼風格，這樣的代碼，並不是那種為了實現某種目的而需要按部就班地執行的一大堆指令，而是關注宏觀上要做什麼。至於具體應該怎麼做

利用純函數進行的計算，可以很方便地擴展到多處理器環境下，或者應用到分佈式計算集群上，同時還不用擔心線程資源衝突、競爭條件之類的問題。

函數式編程的不足：代碼如果過度利用了函數式的編程特性（如無參風格、大量方法的組合），就會影響其可讀性，從而簡潔度有餘、易讀性不足。

大部分工程師還是更熟悉面向對象編程、命令式編程，對於剛接觸函數式編程的人來說，即使只是這個領域的一些的簡單術語，都可能讓他懷疑人生。

函數式編程的學習曲線更陡峭，因為面向對象編程太普及了，學習資料太多了。相比而言，函數式編程在學術領域的應用更廣泛一些，在工業界的應用稍遜一籌，自然也就不那麼“平易近人”了。在探討函數式編程時，人們往往用λ演算、代數、範疇學等學科的專業術語和專業符號來描述相關的概念，那麼其他人想要入門函數式編程的話，就得先把這些領域的基礎知識搞明白，能不讓人頭大麼。

面試加分項

• 共享狀態的缺點、資源競爭、等等（面向對象編程）
• 函數式編程能夠極大地簡化應用開發
• 面向對象編程和函數式編程學習曲線的不同
• 兩種編程方式各自的不足之處，以及對代碼後期維護帶來的影響
• 函數式風格的代碼庫，學習曲線會很陡峭
• 面向對象編程風格的代碼庫，修改起來很難，很容易出問題（和水平相當的函數式風格的代碼相比）
• 不可變性（immutability），能夠極大地提升程序歷史狀態（programstatehistory）的可見性（accessible）和擴展性（malleable），這樣一來，想要添加諸如無限撤銷/重做、倒帶/回放、可後退的調試之類的功能的話，就簡單多了。不管是面向對象編程還是函數式編程，這兩種範式都能實現不可變性，但是要用面向對象來實現的話，共享狀態對象的數量就會劇增，代碼也會變得複雜很多。

面試減分項

• 沒有講這兩種編程範式的缺點——如果熟悉至少其中一種範式的話，應該能夠說出很多這種範式的缺點吧。

深入瞭解

總是你倆，看來你倆真是非常重要啊。

5.什麼時候該用類繼承？

千萬別用類繼承！或者說盡量別用。如果非要用，就只用它繼承一級（onelevel）就好了，多級的類繼承簡直就是反模式的。這個話題（不太明白是關於什麼的……）我也參與討論過好些年了，僅有的一些回答最終也淪為常見的誤解之一。更多的時候，這個話題討論著討論著就沒動靜了。

如果一個特性有時候很有用但有時候又很危險 並且還有另一種更好的特性可以用那務必要用另一種更好的特性~Douglas Crockford

面試加分項

• 儘量別用，甚至是徹底不用類繼承。
• 有時候只繼承一級的話也還是OK的，比如從框架的基類繼承，例如 React.Component。
• 相比類繼承，對象組合（objectcomposition）更好一些。

深入瞭解

6.什麼時候該用原型繼承？

原型繼承可以分為下面幾類：

• 委託（delegation，也就是原型鏈）
• 組合（concatenative，比如混用（mixins）、Object.assign()）
• 函數式（functional，這個函數式原型繼承不是函數式編程。這裡的函數是用來創建一個閉包，以實現私有狀態（privatestate）或者封裝（encapsulation））

上面這三種原型繼承都有各自的適用場景，不過它們都很有用，因為都能實現組合繼承（composition），也就是建立了A擁有特性B（has-a）、A用到了特性B（uses-a）或者 A可以實現特性B（can-do）的這樣一種關係。相比而言，類繼承建立的是 A就是B這樣一種關係。

面試加分項

• 知道在什麼情況下不適合用模塊化（modules）或者函數式編程。
• 知道需要組合多個不同來源的對象時，應該怎麼做。
• 知道什麼時候該用繼承。

面試減分項

• 不知道什麼時候應該用原型。
• 不知道混用和 Object.assign()。

深入瞭解

7.為什麼說“對象組合比類繼承更好”？

這句話引用的是《設計花紋》（DesignPatterns，設計模式）這本書的內容。意思是要想實現代碼重用，就應該把一堆小的功能單元組合成滿足需求的各種對象，而不是通過類繼承弄出來一層一層的對象。

換句話說，就是儘量編程實現can-do、has-a或者uses-a這種關係，而不是is-a這種關係。

面試加分項

• 避免使用類繼承。
• 避免使用問題多多的基類。
• 避免緊耦合。
• 避免極其不靈活的層次分類（taxonomy）（類繼承所產生的 is-a 關係可能會導致很多誤用的情況）
• 避免大猩猩香蕉問題（“你只是想要一根香蕉，結果最後卻整出來一隻拿著香蕉的大猩猩，還有整個叢林”）。
• 要讓代碼更具擴展性。

面試減分項

• 沒有提到上面任何一種問題。
• 沒有表達清楚對象組合與類繼承有什麼區別，也沒有提到對象組合的優點。

深入瞭解

8.雙向數據綁定/單向數據流的含義和區別

雙向數據綁定（two-waydata binding），意味著UI層所呈現的內容和Model層的數據動態地綁定在一起了，其中一個發生了變化，就會立刻反映在另一個上。比如用戶在前端頁面的表單控件中輸入了一個值，Model層對應該控件的變量就會立刻更新為用戶所輸入的值；反之亦然，如果Modal層的數據有變化，變化後的數據也會立刻反映至UI層。

單向數據流（one-waydata flow），意味著只有 Model層才是單一數據源（singlesource of truth）。UI層的變化會觸發對應的消息機制，告知Model層用戶的目的（對應React的store）。只有Model層才有更改應用狀態的權限，這樣一來，數據永遠都是單向流動的，也就更容易瞭解應用的狀態是如何變化的。

採用單向數據流的應用，其狀態的變化是很容易跟蹤的，採用雙向數據綁定的應用，就很難跟蹤並理解狀態的變化了。

面試加分項

• React是單向數據流的典型，面試時提到這個框架的話會加分。Cycle.js則是另一個很流行的單向數據流的庫。
• Angular則是雙向數據綁定的典型。

面試減分項

• 不理解單向數據流/雙向數據綁定的含義，也說不清楚兩者之間的區別。

深入瞭解

9.單體架構和微服務架構各有何優劣？

採用單體架構（monolithicarchitecture）的應用，各組件的代碼是作為一個整體存在的，組件之間互相合作，共享內存和資源。

而微服務架構（microservicearchitecture）則是由許許多多個互相獨立的小應用組成，每個應用都有自己的內存空間，應用在擴容時也是獨立於其它應用進行的。

單體架構的優勢：大部分應用都有相當數量的橫切關注點（cross-cuttingconcerns），比如日誌記錄，流量限制，還有審計跟蹤和DOS防護等安全方面的需求，單體架構在這方面就很有優勢。

當所有功能都運行在一個應用裡的時候，就可以很方便地將組件與橫切關注點相關聯。

單體架構也有性能上的優勢，畢竟訪問共享內存還是比進程間通信（inter-processcommunication，IPC）要快的。

單體架構的劣勢：隨著單體架構應用功能的不斷開發，各項服務之間的耦合程度也會不斷增加，這樣一來就很難把各項服務分離開來了，要做獨立擴容或者代碼維護也就更不方便了。

微服務的優勢：微服務架構一般都有更好的組織結構，因為每項服務都有自己特定的分工，而且也不會干涉其它組件所負責的部分。服務解耦之後，想要重新組合、配置來為各個不同的應用提供服務的話，也更方便了（比如同時為Web客戶端和公共API提供服務）。

如果用合理的架構來部署微服務的話，它在性能上也是很有優勢的，因為這樣一來，就可以很輕鬆地分離熱門服務，對其進行擴容，同時還不會影響到應用中的其它部分。

微服務的劣勢：在實際構建一個新的微服務架構的時候，會遇到很多在設計階段沒有預料到的橫切關注點。如果是單體架構應用的話就很簡單，新建一箇中間件（sharedmagic helpers 不知道怎麼翻譯……）來解決這樣的問題就行了，沒什麼麻煩的。

但是在微服務架構中就不一樣了，要解決這個問題，要麼為每個橫切關注點都引入一個獨立的模塊，要麼就把所有橫切關注點的解決方案封裝到一個服務層中，讓所有流量都從這裡走一遍就行了。

為了解決橫切關注點的問題，雖然單體架構也趨向於把所有的路由流量都從一個外部服務層走一遍，但是在這種架構中，可以等到項目非常成熟之後再進行這種改造，這樣就可以把還這筆技術債的時間儘量往後拖一拖。

微服務一般都是部署在虛擬機或容器上的，隨著應用規模的不斷增加，虛擬機搶工作（VMwrangling work）的情況也會迅速增加。任務的分配一般都是通過容器群（containerfleet）管理工具來自動實現的。

面試加分項

• 對於微服務的積極態度，雖然初始成本會比單體架構要高一些。知道微服務的性能和擴容在長期看來表現更佳。
• 在微服務架構和單體架構應用上都有實戰經驗。能夠使應用中的各項服務在代碼層面互相獨立，但是又可以在開發初期迅速地將各項服務打包成一整個的單體架構應用。微服務化的改造可以在應用相當成熟之後，改造成本在可承受範圍內的時候再進行。

面試減分項

• 不知道單體架構和微服務架構的區別。
• 不知道微服務架構額外的開銷，或者沒有實際經驗。
• 不知道微服務架構中，IPC和網絡通信所導致的額外的性能開銷。
• 過分貶低微服務。說不清楚什麼時候應該把單體架構應用解耦成微服務。
• 低估了可獨立擴容的微服務的優勢。

10.異步編程是什麼？又為什麼在JavaScript中這麼重要？

在同步編程中，代碼會按順序自頂向下依次執行（條件語句和函數調用除外），如果遇到網絡請求或者磁盤讀/寫（I/O）這類耗時的任務，就會堵塞在這樣的地方。

在異步編程中，JS運行在事件循環（eventloop）中。當需要執行一個阻塞操作（blockingoperation）時，主線程發起一個（異步）請求，（工作線程就會去執行這個異步操作，）同時主線程繼續執行後面的代碼。（工作線程執行完畢之後，）就會發起響應，觸發中斷（interrupt），執行事件處理程序（eventhandler），執行完後主線程繼續往後走。這樣一來，一個程序線程就可以處理大量的併發操作了。

用戶界面（userinterface，UI）天然就是異步的，大部分時間它都在等待用戶輸入，從而中斷事件循環，觸發事件處理程序。

Node.js默認是異步的，採用它構建的服務端和用戶界面的執行機制差不多，在事件循環中等待網絡請求，然後一個接一個地處理這些請求。

異步在JavaScript中非常重要，因為它既適合編寫UI，在服務端也有上佳的性能表現。

面試加分項

• 理解阻塞的含義，以及對性能帶來的影響。
• 理解事件處理程序，以及它為什麼對UI部分的代碼很重要。

面試減分項

• 不熟悉同步、異步的概念。
• 講不清楚異步代碼和UI代碼的性能影響，也說不明白它倆之間的關係。

總結

多問問應聘者高層次的知識點，如果能講清楚這些概念，就說明即使應聘者沒怎麼接觸過JavaScript，也能夠在短短几個星期之內就把語言細節和語法之類的東西弄清楚。

不要因為應聘者在一些簡單的知識上表現不佳就把對方pass掉，比如經典的CS-101算法課，或者一些解謎類的題目。

面試官真正應該關注的，是應聘者是否知道如何把一堆功能組織在一起，形成一個完整的應用。

閱讀更多 渡一教育web前端開發 的文章

關鍵字: 面試題 編程語言 JavaScript