八月不刷題，九月徒傷悲~
金九銀十的招聘旺季要來了！各個互聯網大廠都會釋放出大批社招的崗位出來，這個時候做好准備，去大廠、升職加薪的機會非常大！
但是今年問的難度和深度應該比前幾年有所增加，下面從總體分析和重要點兩個維度來分析一下：
總體分析
- 前端問的最多的還是 js基礎、計算機網絡基礎等，建議在此處多下功夫。
- 而 css 相關的很少問到，最多也就問個三欄布局、兩欄布局、水平垂直居中，把前兩節看了面試基本沒啥問題。
- 框架 React/Vue 相關的在中小公司問的多一些，差不多占到面試時間的一半。而大廠不愛問框架，更注重基礎，因為入職之后讓你用哪個框架你就用哪個框架…即使問也是問比較底層的東西，比如 vue 的雙向綁定原理。
重要點
最后再列舉幾個重要的點，無論大中小公司基本都會問的：
性能優化，以及每個優化點具體怎么做，每個點都可能延伸了問。
-
比如你說異步加載，面試官會追問異步加載的方法，deffer 和 async 的區別。
-
你說充分利用緩存，面試官會問緩存都有哪些方式，什么是強緩存什么是協商緩存，它們的返回碼分別是什么，哪些資源存在 memory cache 哪些存在 disk cache…
http/https/http2.0。三次握手四次揮手，https 為什么安全為什么慢，跟 http 的區別，http2.0 都有哪些優化，瀏覽器輸入url到看到頁面的整個流程…
-
安全類的常見的攻擊手段，記好 CSRF 和 XSS 攻擊的原理和防范措施就好了。
-
ES6 新特性，還有針對 var 和 let 的各種變態題。
-
跨域的幾種方式。
除了以上這些，大公司還喜歡讓你介紹一個你覺得做的比較好的項目，有哪些亮點。這塊一定要好好准備，你講的項目用到的技術最好能夠了解的非常深入，避免給自己挖坑。
不同於其他，工程師真的是一個終身學習的行業，尤其是前端領域，知識雜且多、網上資料還良莠不齊，想要靠自己梳理清楚確實不容易。不管你是社招還是校招，下面這份前端面試攻略，請收好。
這里給大家分享一份由字節3-1前端面試官整理的「2021大廠前端面試手冊」，內容囊括Html、CSS、Javascript、Vue、HTTP、瀏覽器面試題\數據結構與算法。全部整理在下方文檔中，共計111道，文檔結構如下：
HTML
- HTML5有哪些新特性？
- Doctype作⽤? 嚴格模式與混雜模式如何區分？它們有何意義?
- 如何實現瀏覽器內多個標簽頁之間的通信？
- ⾏內元素有哪些？塊級元素有哪些？ 空(void)元素有那些？⾏內元 素和塊級元素有什么區別？
- 簡述⼀下src與href的區別？
- cookies,sessionStorage,localStorage 的區別？
- HTML5 的離線儲存的使用和原理？
- 怎樣處理 移動端 1px 被 渲染成 2px 問題？
- iframe 的優缺點？
- Canvas 和 SVG 圖形的區別是什么？
- ......
JavaScript
- 問：0.1 + 0.2 === 0.3 嘛？為什么？
- JS 數據類型
- 寫代碼：實現函數能夠深度克隆基本類型
- 事件流
- 事件是如何實現的？
- new 一個函數發生了什么
- 什么是作用域？
- JS 隱式轉換，顯示轉換
- 了解 this 嘛，bind，call，apply 具體指什么
- 手寫 bind、apply、call
- setTimeout(fn, 0)多久才執行，Event Loop
- 手寫題：Promise 原理
- 說一下原型鏈和原型鏈的繼承吧
- 數組能夠調用的函數有那些？
- PWA使用過嗎？serviceWorker的使用原理是啥？
- ES6 之前使用 prototype 實現繼承
- 箭頭函數和普通函數有啥區別？箭頭函數能當構造函數嗎？
- 事件循環機制 （Event Loop）
- ......
Vue框架
- active-class是哪個組件的屬性？嵌套路由怎么定義
- 怎么定義vue-router的動態路由？怎么獲取傳過來的動態參數？
- vue-router有哪幾種導航鈎子？
- scss是什么？在vue.cli中的安裝使用步驟是？有哪幾大特性？
- mint-ui是什么？怎么使用？說出至少三個組件使用方法？
- v-model是什么？怎么使用？ vue中標簽怎么綁定事件？
- axios是什么？怎么使用？描述使用它實現登錄功能的流程？
- 什么是RESTful API？怎么使用?
- vuex是什么？怎么使用？哪種功能場景使用它？
- mvvm框架是什么？它和其它框架（jquery）的區別是什么？哪些場景適合
- 自定義指令（v-check、v-focus）的方法有哪些？它有哪些鈎子函數？還有哪些鈎子函數參數？
- 說出至少4種vue當中的指令和它的用法？
- Vue的雙向數據綁定原理是什么？
- 請詳細說下你對vue生命周期的理解？
- 請說下封裝 vue 組件的過程？
- 你是怎么認識vuex的？
- vuejs與angularjs的區別？
- ......
計算機網絡
- HTTP 緩存
- 你知道 302 狀態碼是什么嘛？你平時瀏覽網頁的過程中遇到過哪些 302 的場景？
- HTTP 常用的請求方式，區別和用途？
- HTTPS 是什么？具體流程
- 三次握手和四次揮手
- 你對 TCP 滑動窗口有了解嘛？
- WebSocket與Ajax的區別
- 了解 WebSocket 嘛？
- HTTP 如何實現長連接？在什么時候會超時？
- TCP 如何保證有效傳輸及擁塞控制原理。
- TCP 協議怎么保證可靠的，UDP 為什么不可靠？
- ......
算法
- 鏈表
- 字符串
- 數組問題
- 二叉樹
- 排序算法
- 二分查找
- 動態規划
- BFS
- 棧
- DFS
- 回溯算法
- ......
附送一份「高級前端工程師必備資料包」
