前端面試知識點總結

通過一個多月的面試，整理知識點和簡歷，再面試再整理，終於在上週成功收到2個offer，最終成功入職，藉此機會整理成文。但願能給正在找工做的前端小夥伴，或者準備跳槽的同窗提供一些參考吧。本文知識點參考了慕課網上視頻《 前端跳槽面試必備技巧》，結合了本身面試過程當中碰到的一些問題。但願小夥伴們能把這些知識點都能掌握，下來就是各類面試輕鬆應對了。

一. CSS類

• 水平居中 - text-align，position，flex
• 垂直居中 - margin，position，flex
• 兩列布局 - float，position，table，flex，grid
• 三列布局 - float，position，table，flex，grid
• CSS盒模型 - 概念，標準模型和怪異模型，css實現，BFC的原理和特定以及如何建立
• 清浮動的方式 
• CSS3實現動畫
• 移動端適配的實現方案

二. DOM事件類

• 基本概念 - DOM事件的級別
• 事件模型 - 冒泡和捕獲的流程  window <-> document <-> html <-> body <-> ... <-> target
• Event對象 - event.preventDefault()  阻止默認事件  event.stopPropagation() 阻止冒泡
• 事件代理/委託 - 概念，具體作法，好處
• 自定義事件Event類 
• CustomEvent   

三. 數據類型轉換

• 數據類型有哪些 - 7種
• typeof的結果有哪些
• 類型轉換 - 顯示轉換和隱式轉換
• 顯示轉換 - 基本類型轉換 Number() String() Boolean()方法 & 對象類型轉換 - 對象類型轉換裏注意 {} 的valueOf和toString方法  {} + {} => "[object Object][object Object]" 爲何是這樣的結果？
• 隱式轉換 - 四則運算，判斷語句  
• ES5 - Object.create()  Object.assign()  Object.defineProperty()
• ES6 - 箭頭函數的this，Promise下的方法

四. 面向對象

• 建立對象的幾種方法
• instanceof的原理
• new運算符的執行過程
• 說說對原型鏈的理解
• 繼承有幾種方式 - 構造函數繼承，原型繼承，混合繼承，利用空對象繼承等

五. HTTP相關

• HTTP協議的特色
• HTTP報文的組成部分 - 請求報文和響應報文
  
• HTTP方法有哪些
• get和post的區別
• HTTP狀態碼
• HTTP持久鏈接和管線化
• 同源策略的概念
• 如何實現跨域 - 五種方式
• 建立Ajax的流程

六. 瀏覽器渲染及存儲方面

• 什麼是DOCTYPE及做用
• 瀏覽器的渲染過程 - reflow 和 repaint的區別和觸發條件
• 任務隊列以及Event Loop
• 異步任務有哪些 - setTimeout，事件綁定on，發佈/訂閱，Promise
• 提升頁面性能的方法
• 瀏覽器緩存 - 強緩存和協商緩存
• 錯誤監控的方式有哪些 - 即時運行錯誤 & 資源加載錯誤
• cookies和localStorage，sessionStorage的區別

七. MVVM框架

• 對MVVM的理解 - 相比MVC，MVVM有什麼優勢
• 雙向綁定的原理
• 如何實現一個簡單的組件 - 父子組件的交互，computed和watch的區別，vuex
• 生命週期 - 經常使用的鉤子函數有哪些
• 設計模式

知識點就整理這麼多吧，若是哪裏寫的有問題，或者遺漏重要知識點，歡迎指正！面試中還有一點挺重要的，就是要有好的心態，千萬不要由於幾回失敗而失去自信，堅持到底就必定能成功進入本身喜歡的公司。最後，祝小夥伴們Good Luck！！！