7個讓你獲益匪淺的開放式前端面試題

翻譯：瘋狂的技術宅

原文：https://www.indeed.com/hire/interview-questions/front-end-developer

無論你是面試官仍是求職者，裏面的思路都能讓你獲益匪淺。

如何保證你的網站或 Web 應用的可訪問性？

解析：

前端開發人員在爲最終用戶設計體驗時須要充分掌控其可用性和可訪問性。這個問題讓面試官知道求職者對這些標準和最佳實踐的瞭解。

面試官想要知道些什麼：

• 實施可用性和可訪問性標準的第一手經驗
• 保證可訪問性的手段
• 求職者是否曾經在項目中對可用性和可訪問性作過實施

參考答案：

我在各類瀏覽器和設備上測試個人 Web 應用，檢查在全部設備上的體驗是否可用。我還使用流行的屏幕閱讀軟件和其餘輔助解決方案來查看是否全部潛在用戶均可以訪問它。」

你最喜歡 HTML5 的哪些功能，以及如何在前端項目中實現？

解析：

前端開發會在 HTML5 上花費大量時間，他們整合 Web 設計並實現各類功能，從而節省開發時間並改進最終產品。

面試官想要知道些什麼：

• 深刻了解 HTML5 功能
• 可以清楚的解釋求職者在過去的項目中是如何使用HTML5的
• 對 HTML5 的創造性應用

參考答案：

與之前的版本相比，我喜歡 HTML5 對多媒體的支持。我使用此功能開發時，會把視頻和音頻做爲用戶體驗的重要組成部分，而沒必要擔憂它沒法正確加載或破壞頁面。

如何對 CSS 和 JavaScript 代碼進行組織，以使其餘開發人員更容易使用？

解析：

前端開發人員常常會處理由之前的員工建立的代碼，或做爲團隊的一員工做。這個問題讓面試官瞭解求職者能不能建立其餘員工能夠理解的網站或 Web 應用。

面試官想要知道些什麼：

• 具備組織代碼和註釋代碼的經驗
• 若是沒有對代碼進行恰當的註釋會發生什麼後果
• 願意讓開發團隊其餘成員更輕鬆

參考答案：

我把站點的每一個組件都分拆出了獨立的代碼。每一個代碼片斷都有註釋，以便其餘開發人員能夠更改它。

你能解釋一下 CSS float 的概念並舉例嗎？

解析：

該技術問題考察面試者對常見 CSS 元素的理解。這個問題用來篩選求職者，並確保他們不僅是可以熟練使用 CSS 的好辦法。

面試官想要知道些什麼：

• CSS float 的具體定義是什麼
• 求職者是怎樣在他們的代碼中使用此元素的
• 是否可以向任何人解釋這一技術概念

參考答案：

CSS float 告訴瀏覽器將特定元素放在容器的右側或左側。當我開發基於用戶分辨率動態調整大小的頁面時，使用float。」

你是怎樣處理特定瀏覽器的渲染問題的？你是否發現某個瀏覽器比其餘瀏覽器更具挑戰性？

解析：

基於每一個瀏覽器的渲染的方式，前端開發人員必須將特定於瀏覽器的 hack 引入Web 應用和頁面。對於求職者來講，這個常見的過程應該是比較熟悉的。

面試官想要知道些什麼：

• 針對特定瀏覽器的解決方法示例
• 瞭解瀏覽器如何呈現應用和頁面
• 瞭解特定瀏覽器的特色

參考答案：

我常常須要修改 Microsoft Edge 網頁上的 DIV 位置。對於我來講，這個瀏覽器是最有問題的，由於我幾乎不會在 Chrome 或 Firefox 上遇到這類問題。

你經過哪些途徑來了解最新的前端技術？

解析：

前端開發中的技術和標準在不斷變化。擁有「持續學習」能力的求職者能夠經過不斷的學習，來獲取改進開發過程和改善最終用戶體驗的方法。

面試官想要知道些什麼：

• 求職者都讀過什麼技術書籍
• 是否參與開源項目或我的有什麼開源項目
• 是否參加繼續教育或在線課程

參考答案：

我有訂閱了幾個前端開發方面的雜誌，並常常訪問 Stack Overflow 論壇。這些資源幫助我瞭解前端開發的最新技術。

你最喜歡的前端項目是什麼？爲何？

解析：

這個問題可以讓面試官深刻了解前端開發人員的我的偏好。一些求職者可能更傾向網站項目，而其餘人更喜歡參與Web 應用團隊。

面試官想要知道些什麼：

• 對他們最喜歡的發展方向的看法
• 他們描述該項目時表現出的熱情
• 他們最喜歡的前端項目的案例

參考答案：

我最近爲當地醫院開發了一個網絡應用。它簡化了患者的求醫過程，當我知道本身的工做能幫助患者更快地得到所需的幫助時很是開心。

歡迎關注京程一燈公衆號：jingchengyideng，獲取更多前端技術乾貨。