<aside> 💡 如果你看完解答後，想進一步瞭解每題的詳細解題思路，可以訂閱 ExplainThis 的 E+ 成長計畫。在 E+ 當中，我們有收錄更多常見的題目，並且每一題除了解答，還有附上詳細的思路分析。此外，E+ 有討論專區，任何不懂的問題都可以提問，獲得進一步的解說。
👇 可以在以下網址了解 E+ 成長計畫 **https://www.explainthis.io/zh-hant/e-plus**
👇 更多免費的前端學習資源，可以在 ExplainThis 網站上看到
👇 若想練習更多前端手寫題，我們推薦 GreatFrontEnd **https://www.greatfrontend.com/prepare/coding?fpr=explainthis**
</aside>
在前端工程師的面試中，許多時候不會考傳統資料結構演算法的程式問題，而是會考前端手寫題。所謂的前端手寫題，是要請候選人，去自己寫出一些在前端開發時會用到的函式。
舉例來說，最常見的是 Lodash 套件中很常會用到的，從簡單的 chunk 函式，到有比較多細節要考慮的 cloneDeep 函式，都是經常會考的。另外許多 JavaScript 目前已經有原生支持的方法，例如 Promise.all 也是很常會出現的。
對比起資料結構與演算法白板題，前端手寫題在考的，更貼近實際工作會運用到的概念。有些題目會用到閉包 (closure)，有些會用到遞迴 (recursion)，也有些會用到 JavaScript 中各種常見的 Promise、SetTimeout、class 等概念。
ExplainThis 彙整了常見的前端手寫，並按照類別與難易程度做區分。除了收錄 LeetCode 上的 30 天 JavaScript 手寫題挑戰外，我們還另外彙整了 20 題常考的題目，總共 50 題，讓大家為面試做好充足的準備。
每題除了有題目外，也有附上解答。因為 50 題的內容比較長，我們分成上與下兩個文件。可以點擊以下個文件，前往練習 (備註：如果你本身有用 Notion， 可以直接複製下方這兩個文件到自己的 Notion，就可以自行編輯、做筆記。)
以下為六大類，共 50 題的題目，每題的詳細描述與解答，Part 1 到 Part 2 共 28 題收錄在 50 題前端程式題大補帖 (上) ，而 Part 3 到 Part 6 共 22 題收錄在 50 題前端手寫題大補帖 (下)
<aside> 🔹 Part 1 - Lodash 手寫題
Easy 手寫 clampEasy 手寫 inRangeEasy 手寫 compactEasy 手寫 differenceEasy 手寫 dropWhileEasy 手寫 dropRightWhileEasy 手寫 fillEasy 手寫 fromPairsMedium 手寫 getMedium 手寫 cloneDeep (深拷貝)Medium 手寫 isEqual(深比較)Medium 手寫 throttle (節流函式)Medium 手寫 debounce (防抖函式)
</aside><aside> 🔹 Part 2 - 陣列 (Array)
Easy 手寫陣列 findIndexEasy 手寫陣列 squareEasy 計算陣列中所有數字的平均數Easy Remove Duplicates (陣列去除重複) ****Easy 手寫 Array.prototype.atEasy Array Prototype Last (陣列的最後一個元素)Easy Chunk Array (陣列分塊)Easy Apply Transform Over Each Element in Array (手寫原生陣列 map 方法)Easy Filter Elements from Array (手寫原生陣列 filter 方法)Easy Array Reduce Transformation (手寫原生陣列 reduce 方法)Easy Sort By (依據排序)Medium 手寫 consolidateDataMedium Group By (陣列分組)Medium Flatten Deeply Nested Array (陣列扁平化)Medium Join Two Arrays by ID (根據 ID 合併兩個陣列)
</aside>