字節跳動前端實習生面試回顧

一面

面試官是個超級親切的小哥哥，問了很多前端的知識。

1. visibility 和 display 的差異（還有opacity)
2. opacity能夠有過渡效果麼
   有
3. opacity爲0.5的元素，背景色0.5alpha是更淺麼？
   我回答是
4. 如何用css實現這樣的動畫：某個元素能夠移動到鼠標處
   我不會。問面試官能不能用用js，確定後問如何模擬動畫效果。我說使用setTimeout，和for循環
   接下來問我會用requestAnimationFrame麼?我只是知道，沒用過。
   而後，面試官很是親切地和我講了requestAnimationFrame比起setTimeout的優點，前者能保證在下一幀時執行，不會形成幀丟失。
5. ES5新增對數組操做 map, filter 和 reduce 分別是什麼
6. forEach的參數是什麼
   一個回調函數，函數的參數是這個數組的元素，返回void
   追問：第二個參數是什麼
   回答：index
   補充：是forEach的第二個參數
   回答：我不清楚orz
   面試官告訴我是this
7. js中的this很特殊，舉例改變this的方法
   call 和 apply
   追問：有什麼不一樣
   參數形式不一樣，可是我忘了哪一個是傳數組
8. setTimeout(fn, 0)多久才執行
   這個是js單線程的執行阻塞問題。個人回答是：因爲setTimeout異步線程，會立刻被掛起，而後執行一條同步指令以後再去查看掛起的線程，才執行，也就是時間是執行一條同步指令的時間。
   面試官質疑是否是執行完同步指令以後立刻去檢查，我說應該是有相似於nextTick,固定的週期去檢查。
   最後我記得面試官的意思應該是，處理器空閒時去檢查異步線程。
9. nextTick, immidiately和setTimeout(0)哪一個先
   什麼？？？immidiately是什麼東西？？？我就說immidiately -> nextTick -> setTimeout(0)
   面試官說答案是nextTick最早
10. 談談你對webpack的理解
    是一個對資源進行模塊化和打包的工具，處理每一個模塊的 import 和 export
    追問：資源是指什麼？
    回答：Js,css,png圖片等
    追問：若是有個二進制文件，它是資源麼？webpack怎麼使它模塊化？
    回答：是。須要有一個對應的loader來處理（我是想到了vue-loader等)
11. 中間件是什麼
    express實際上是由一堆中間件堆起來的服務器開發框架
    app.use(callback)
12. 如何對特定路徑使用中間件
    我回答的是在app.METHOD()，傳入相應的中間件，我講得不清楚，被誤會成只傳一箇中間件，而後再調next去回到路由controller（最後的問題詢問時才知道我表達得不清楚）
    我還回答了說我使用的一些框架中能夠直接對controller註解@use使用特定中間件
13. 用js實現LRU策略的cache
    我最早用數組實現的隊列
    面試官提示後改用鏈表，而後使用雙向鏈表，永遠實現踢出隊頭，從隊尾進。每次訪問某一節點時，將它提到隊尾（就是基本的鏈表操做）（寫代碼）
14. 實現一個 fetchImage(n)： Promise<Image>的函數，n爲時限，超時請拋錯
    我先用了setTimeout
    而後設置flag是標識是否加載完成，
    又改爲clearTimeout
    最後面試官提示用 Promise.race()，豁然開朗。

二面

1. 寫單例模式
   單例模式優勢：我不會
2. 工廠模式
   寫代碼
   優勢：鬆耦合，將對象的建立這種變化從業務邏輯代碼中分離

3. 談談DI和AOP
   我不會AOP，而後直接講了DI的原理和實現，手擼了個簡單的IoC

   @interface Service {
   Class target();

   }

   @Service(target = MySwim.class)
   interface ISwim {
   }

   class MySwim implements ISwim {}

   class Ioc {

   HashMap<String, Object> dependecies = new HashMap<>();
   
   public T <T> resolve(Class aClass) {
       
   }

   }
   講解說利用註解去註冊實現，經過反射去獲取構造注入中的參數，而後去依賴註冊map中尋找

4. 用js實現一個函數，簡化路徑相似 '../a/b/../b/c'
   我傻到忘記了split而手動去劃分，可是我說明了整體算法就是利用 棧 來實現
   面試官強行安慰我：「你是原生js用得少了，不要緊」
5. 從地址欄輸入地址到用戶看到東西，通過了什麼
   我第一次回答漏掉了緩存和#標識，這二者並不會都向服務器發送請求，而後結果忽略了可能返回404等錯誤

不容許轉載