今年面試咆畏，相對于剛畢業(yè)那會面了10家拿了4份offer溺健，進步了一丟丟，主要是offer的質(zhì)量也提升了很多岭辣，主要在于準備面試的時候，把面試題做了分類總結(jié)偷遗，這樣有利于記憶并且有利于對知識點的理解，以下是今年準備的面試題以及在面試中被問到的題目總結(jié)，記錄一下涣旨，后續(xù)有空更新日常記錄的面試題答案

注釋1： 序號為主題目，在回答中引申出其他問題攒霹，主題目下面的分類則為引申問題

注釋2： 面試中除了基礎(chǔ)知識，還應(yīng)該準備項目亮點，以及根據(jù)簡歷可能會引申出的場景題速妖，該處暫不做此記錄

CSS

1. 說說css選擇器稿饰，以及它們的優(yōu)先級
2. 說說bfc
3. 說說css選擇器是從左往右解析還是從右往左解析
4. 實現(xiàn)垂直水平居中

JS基礎(chǔ)

1. 說說閉包吧
   • 什么是作用域喉镰，作用域鏈
   • 什么是執(zhí)行上下文
   • 函數(shù)的執(zhí)行是怎么樣的
   • 說說垃圾回收機制
2. 說說原型脖咐，原型鏈
   • 原型鏈指向null之前的時候指向哪里
   • 說說js繼承
   • es6的class繼承和es5的區(qū)別
3. 說說箭頭函數(shù)和普通函數(shù)的區(qū)別
   • 說說this
   • 說說改變this指向的方法
   • 手寫apply, bind, call
4. 說說值傳遞和引用傳遞的區(qū)別
   • 說說js的幾種基本類型和引用類型，以及區(qū)別
   • 如果判斷基本類型和引用類型
5. 說說你熟悉的es6
   • let, const, var的區(qū)別
   • for of和for in的區(qū)別
     • 什么是迭代器
       • 說說generator函數(shù)
       • async await
   • 數(shù)組的es6方法
   • 了解Set, weakSet, Map, weakMap嗎弯囊？
     • Set和weakSet的區(qū)別
   • promise
     • 瀏覽器的事件循環(huán)
       • 可能還會問和Node的事件循環(huán)的區(qū)別

http

1. http的狀態(tài)碼
   • 304代表什么霎烙，說說強緩存和協(xié)商緩存
2. http1和http2的區(qū)別
3. http和https的區(qū)別
   • http的響應(yīng)頭有哪些設(shè)置
   • 說說CSRF, XSS悬垃，以及前端怎么預(yù)防
   • cookie和session的區(qū)別

瀏覽器

1. 說說瀏覽器渲染html的過程
2. 說說重繪回流
3. 說說瀏覽器的同源策略
4. 說說跨域

Vue

1. 說說你了解的vuex
   • Action和Mutation的區(qū)別
   • Action可以有返回值嗎游昼？
2. 說說vue-router中的兩種模式和區(qū)別
   • 說說vue-router的鉤子
3. 說說vue響應(yīng)式
   • 響應(yīng)式是data影響視圖，那視圖影響data怎么做的（考察v-model）
   • vue3的響應(yīng)式做了哪些修改尝蠕，有什么好處
4. 說說compile過程（模板解析過程）
   • AST解析怎么保證節(jié)點層級關(guān)系
5. 說說diff
   • diff的時間復(fù)雜度
     • 沒優(yōu)化前的diff的時間復(fù)雜度烘豌，為什么
   • patch過程是哪兩個元素的比較
     • 什么是虛擬dom，虛擬dom和真實dom的區(qū)別
6. key的作用
   • key應(yīng)該注意什么
7. 組件data為什么是函數(shù)
8. create和mounted的區(qū)別
9. computed和watch的區(qū)別
10. 組件通信
    • 說說EventBus
11. 說說axios看彼，可以做哪些設(shè)置

webpack

1. 說說webpack的解析過程
2. 說說怎么優(yōu)化打包前的體積以及打包后的速度
   • shaking tree應(yīng)該注意什么
3. 熱更新原理是什么

性能優(yōu)化

說說你對前端優(yōu)化的想法

• 什么是節(jié)流防抖
  • 手寫節(jié)流廊佩，防抖
• 滾動加載，懶加載
  • 懶加載實現(xiàn)思路闲昭，有幾種實現(xiàn)辦法罐寨，有什么最優(yōu)方法嗎

React

這塊題目主要來自幾個前端朋友的面試描述，我沒準備react相關(guān)題目序矩，特此記錄下

1. react團隊為什么要將類組件轉(zhuǎn)為函數(shù)式組件鸯绿，他的根本原因是什么？
2. react的架構(gòu)是什么樣的簸淀？（15和16不一樣）
   • 15：協(xié)調(diào)—>渲染
   • 16：調(diào)度—>協(xié)調(diào)->渲染
3. 描述一下 一次update的過程
4. fiber你了解嗎瓶蝴？
   • 原理
   • 出現(xiàn)的原因
   • 和15diff對比的優(yōu)點
   • fiber是如何實現(xiàn)重用上次工作的？
     • 15版本 協(xié)調(diào)器和渲染器是交替的
     • 16版本 這是因為協(xié)調(diào)器將所有的對比工作做完才一次性commit給渲染器
5. hooks的原理租幕？
6. redux
   • 原理
   • 三大原則
7. react的diff算法和vue的區(qū)別舷手？

算法

這塊我主要是按照數(shù)據(jù)結(jié)構(gòu)的知識點順序在leetcode上做的算法題，實際面試中遇到算法題不多

1. 斐波那契相關(guān)(面試考察最多次)
2. 棧隊列相關(guān)題目
3. 鏈表（該知識點考察最多的是快慢指針法劲绪，雙指針法男窟，例如vue diff就是雙指針移動相互比較）
4. 二叉樹（前序中序后序遍歷，二叉樹的高贾富，相似二叉樹歉眷，等等）

手寫題

1. 節(jié)流，防抖
2. 深拷貝
3. 手寫bind
4. 手寫map
5. 手寫new函數(shù)
6. 手寫promise