抖音前端實習面試經歷：大二學生的一面通關記

背景介紹

先說說我自己的情況吧。我是某985高校計算機專業大二學生，大一的時候自學了前端，從HTML/CSS一路學到React，期間做了兩個個人項目放在GitHub上。說實話，投抖音前端實習的時候我心裡完全沒底——畢竟我才大二，身邊投實習的基本都是大三甚至研究生學長學姐。

但我想著，反正投了也不虧，大不了就是被拒嘛。於是在抖音校招實習通道開放的第一天就投了簡歷，崗位是前端開發實習生。沒想到大概一週後就收到了面試邀請，當時激動得差點從椅子上跳起來。

面試安排的是線上視頻面，用的飛書會議。面試官是一位看起來很年輕的小哥，後來知道是抖音電商部門的前端開發。整場面試大概55分鐘，節奏緊湊但不壓迫，體驗還是不錯的。

面試流程復盤

自我介紹環節（約3分鐘）

面試官讓我先做個自我介紹。我提前準備了一個1分鐘左右的版本，重點說了技術棧和項目經歷。這裡建議大家自我介紹不要太長，突出重點就行，面試官後面會根據你的介紹來追問。

CSS佈局部分（約10分鐘）

面試官先問了CSS佈局相關的問題，這部分我回答得還算順利。

問題1：flex和grid佈局的區別是什麼？分別適合什麼場景？

我說flex是一維佈局，適合單行或單列的排列；grid是二維佈局，適合複雜的行列交叉佈局。然後舉了個例子，比如導航欄用flex就很方便，而整個頁面的柵格佈局用grid更合適。面試官追問了flex的常用屬性，我提到了justify-content、align-items、flex-grow、flex-shrink這些，還特別說了flex: 1其實是flex-grow: 1、flex-shrink: 1、flex-basis: 0%的簡寫。

問題2：如何實現一個元素水平垂直居中？

這個太經典了，我說了四種方式：flex的justify-content + align-items、grid的place-items: center、絕對定位+transform、絕對定位+margin auto。面試官點了點頭，沒有繼續追問。

JavaScript基礎部分（約15分鐘）

這部分問得比較深，也是我覺得最有挑戰的環節。

問題3：說說你對閉包的理解。

我說閉包就是函數能夠訪問其外部作用域的變量，即使外部函數已經執行完畢。然後舉了個經典的計數器例子。面試官追問：閉包會導致什麼問題？我說內存洩漏，因為被引用的變量不會被垃圾回收。他又問怎麼解決，我說手動將引用設為null。

問題4：原型鏈是什麼？

我從__proto__和prototype的關係講起，說了對象通過__proto__指向其構造函數的prototype，一直往上直到null。面試官讓我畫了一下原型鏈的圖，我就在紙上畫了obj -> Foo.prototype -> Object.prototype -> null這條鏈。他還問instanceof的原理，我說就是沿著原型鏈查找右邊構造函數的prototype是否在左邊對象的原型鏈上。

問題5：var、let、const的區別？

這個比較基礎，我說了var有變量提升、let和const有塊級作用域、const聲明後不能重新賦值。面試官追問const聲明的對象能不能修改屬性，我說可以，因為const保證的是引用地址不變，不是值不變。

React基礎部分（約10分鐘）

問題6：React中key的作用是什麼？

我說key幫助React識別哪些元素發生了變化，在diff算法中用來提高復用率。如果用index作為key可能會出問題，比如列表重新排序時會導致不必要的渲染甚至bug。面試官追問了具體什麼bug，我說了比如刪除列表項時可能把狀態綁定到錯誤的元素上。

問題7：useState和useEffect的執行時機？

我說useState在組件渲染時初始化state，後續調用返回最新值；useEffect在DOM更新後異步執行，相當於componentDidMount + componentDidUpdate + componentWillUnmount的組合。面試官還問了useLayoutEffect和useEffect的區別，這個我答得不太好，只說了useLayoutEffect是同步執行的，在DOM更新後立即執行，可能會阻塞渲染。

手寫代碼部分（約12分鐘）

問題8：手寫防抖函數。

這個我準備過，寫起來還算順利。核心思路就是每次調用先clearTimeout，然後重新設置一個定時器。面試官讓我解釋一下代碼，我說了防抖的原理是隻在最後一次觸發後的延遲時間到了才執行，適合搜索框輸入這種場景。

問題9：手寫節流函數。

節流我也寫出來了，用的是時間戳的方式。核心是記錄上一次執行時間，如果當前時間減去上次執行時間大於間隔就執行。面試官問防抖和節流的區別，我說防抖是等最後一次，節流是固定間隔執行一次。

算法部分（約5分鐘）

問題10：LeetCode 1 兩數之和。

這道題太經典了，我直接用哈希表的方式寫出來了，時間複雜度O(n)。面試官讓我說了下思路，我說遍歷數組，對每個元素檢查target - nums[i]是否在哈希表中，如果在就返回兩個索引，不在就把當前元素加入哈希表。

真題匯總

1. flex和grid佈局的區別及適用場景

2. 元素水平垂直居中的多種實現方式

3. 閉包的概念、應用場景及內存問題

4. 原型鏈的原理及instanceof的實現

5. var、let、const的區別

6. React中key的作用及使用index作為key的問題

7. useState和useEffect的執行時機

8. useLayoutEffect和useEffect的區別

9. 手寫防抖函數

10. 手寫節流函數

11. 兩數之和（LeetCode 1）

心得建議

1. 基礎真的很重要。這次面試雖然沒問特別難的問題，但每個知識點都問得比較深入。比如閉包不只是概念，還要知道內存洩漏的問題；原型鏈不只是說一句話，還要能畫圖、能解釋instanceof。所以學基礎的時候一定要理解透徹，不能只背概念。

2. 手寫代碼一定要練。防抖節流這種高頻手寫題，光看懂不夠，必須能手寫出來。建議大家在面試前至少把常見的20道手寫題都寫一遍，形成肌肉記憶。

3. 算法不要怕。實習面試的算法題一般不會太難，像兩數之和這種easy題出現的概率很高。把LeetCode hot 100的easy和medium刷一遍基本夠用了。

4. 項目經歷要準備好。雖然這次面試沒怎麼深挖項目，但自我介紹的時候面試官明顯對我的項目感興趣。建議大家準備2-3個有亮點的項目，能說清楚技術選型、遇到的難點和解決方案。

5. 大二也可以投實習。不要覺得自己年級低就不敢投，很多公司對實習生的基礎要求沒有想像中那麼高。只要基礎扎實、有項目經歷，大二拿實習offer完全有可能。

FAQ

Q：抖音實習面試一般幾面？

A：前端實習一般1-2面技術面，我這次只有一面就拿到offer了，可能是因為實習崗位的要求相對低一些。

Q：面試用的什麼平台？

A：飛書會議，視頻面試。代碼是在飛書的在線文檔裡寫的，不是LeetCode那種在線編輯器。

Q：沒有實習經驗能過嗎？

A：能。我之前沒有任何實習經歷，主要靠項目和個人技術博客。面試官更看重基礎和潛力。

Q：面試結果多久出？

A：我面完大概3天就收到HR電話了，效率還是挺高的。

Q：大二實習和大三實習有什麼區別？

A：基本沒有區別，面試流程和考察內容是一樣的。大二的優勢是時間更充裕，劣勢是課程可能還沒學完，需要自己補基礎。