前端面試：看了很多的前端面試真題，現在你知道怎么準備面試了嗎？

前言：

下面分享了一些關于騰訊，酷狗，位元組（實習的）面試真題，讓大家參考，大家也自己去收集整理其他的面試題，可以通過這些面試題，查看自己的不足，也可以了解自己想要去的公司容易出現的面試題，進行有針對性復習，

騰訊

一面

• 自我介紹
• 簡單聊了一下教育背景，問了一下專業學過的課程
• 為什么選擇前端開發
• 深挖了一下前端開發的專案經歷
• 演算法題：給一篇文章，統計文章中出現次數最多的單詞，給出單詞和次數（注意可能存在多個次數最大的單詞）
• 講一下正則運算式
• 了解網路通信嗎，講一下https
• 專案中有遇到過跨域嗎，講一下跨域
• 了解XSS攻擊嗎
• 了解less嗎
• vue了解哪些原理，自定義事件知道嗎
• css水平垂直居中
• 一道智力題：5:15的時針和分針夾角是多少(67.5)
• 講一下typescript，有哪些關鍵字
• js繼承講一下
• React學過嗎（沒學過，準備學，，，）
• 未來的學習方向怎么規劃
• 反問
  (只能想起來這么多，面完之后確實感徑訓礎不太扎實)

酷狗

一面

• 自我介紹
• 介紹一下自己的專案，（從專案背景，專案完成的功能，難點介紹）
• 專案中用什么資料庫，是關系型資料庫嗎，有沒有用到sql陳述句？
• 你的資料庫多大，有幾張表？
• 怎么實作資料請求的？
• 云函式怎么實作的，nodejs嗎？
• 講一下宏任務和微任務
• 講一下事件回圈
• 講一下任務佇列是由佇列做的還是堆疊做的？
• vue父子組件怎么實作通訊？
• JS常見資料結構有哪些？
• 陣列和鏈表有什么區別？
• 你用原生JS寫過什么專案嗎？
• 常見的演算法有哪些？
• 講一下動態規劃吧，動態規劃有哪些例子？
• 反問

位元組：

一面

• webAPP的適配
• 前端四大存盤方式
• axios封裝為攔截類是怎么實作的
• travis（一個用于CICD的一個庫）
• restful介面規范
• 瀏覽器可以發送哪些請求（get、post等）
• MySQL對鎖是怎么處理的
• 如果兩個用戶同時訪問一個資料，并且對其進行讀寫操作，MySQL是怎么處理這個問題的
• 專案中遇到的困難，如何解決的
• 組件庫實作了什么組件，介紹一下
• TCP三次握手
• get、post請求屬于TCP還是UDP
• 懶加載是怎么完成的
• get、post的區別是什么
• 跨域（jsonP、cors）
• 演算法（滑動視窗or回溯）

二面

• 前端學習了幾年了，如何學習的前端
• 大小端存盤
• 有一個已經上線的專案，專案中出現了一個bug，如果在不影響用戶的情況下實作專案的bug的修復，也就是重新部署
• TCP三次握手里有什么重要資訊（確認序號等）
• 從輸入url到渲染出頁面經過了什么程序
• DNS有幾種查詢方式
• 什么時候用遞回查詢，什么時候用迭代查詢
• 說明一下你對腳手架的理解
• websocket
• react和Vue有什么區別
• mysql有幾種索引
• 演算法：給了一張無向圖（資料結構），求最短路徑，1-5點之間的最短路徑，要求列印出中間經過的路徑，

面試前的準備

一、簡歷的準備

簡歷制作是很重要的一個環節，一份好的簡歷會給面試官留下很不錯的印象，也有助于你順利通過簡歷篩選環節，

• 個人基本資訊：主要是姓名，聯系方式，郵箱，學歷等；
• 技術技能：對了解、熟練掌握、精通這類詞有概念，不要隨便用精通；因為面試官一般會根據簡歷內容進行提問，
• 專案經歷：不寫對求職無用專案經歷、做的最好的專案 2 ~ 3 個即可，有資料支撐；
• 作業經歷：簡略概述名稱、在職時間、職位以及主要負責業務，也可以和專案經歷結合起來寫；

注意事項：

• 突出亮點：如開源專案、大廠背景、知名專案、個人博客、技術亮點等；
• 針對不同公司職位，可以針對性的調整簡歷內容，準備多份簡歷；
• 格式排版：PDF 格式，最好一頁，最多不超過兩頁，認真檢查排版、錯別字、標點符號、措辭；

二、知識準備

1. 知識體系

優秀的開發者很多都有維護自身知識體系的習慣，建立知識體系能幫助認知知識全貌及迅速找到知識的關聯，就像對碎片化的知識做了索引，知識體系可以幫助你盡快了解自己，幫助你查漏補缺，讓你能夠把寶貴的時間聚焦于自己的薄弱項，

2，基礎知識

html，css，js 的核心知識，其中 js 的核心知識尤為重要，

HTML
1，你如何理解HTML結構的語意化
2，說說 title 和 alt 屬性
3，Html5 有哪些新特性、移除了哪些元素
4，Label的作用是什么？是怎么用的？
5，瀏覽器是怎么對 Html5 的離線儲存資源進行管理和加載的呢
6，iframe有那些缺點？
7，HTML W3C的標準
8，Doctype作用? 嚴格模式與混雜模式如何區分？它們有何意義?
9，HTML全域屬性(global attribute)有哪些
10，viewport的content屬性作用
11，meta 相關
12，div+css的布局較table布局有什么優點
13，簡述一下src與href的區別
14，知道的網頁制作會用到的圖片格式有哪些
15， 如何在 HTML5頁面中嵌入音頻與視頻？
…

CSS

1，水平居中的方法
2，垂直居中的方法
3，link 與 @import 的區別
4，三列布局（中間固定兩邊自適應寬度）
5，BFC 有什么用
6，清除浮動的幾種方式
7，CSS3有哪些新特性
8，css3 新增偽類 - 偽元素
9，為什么要初始化CSS樣式
10，IE盒子模型 、W3C盒子模型
11，請解釋一下CSS3的Flexbox（彈性盒布局模型）,以及適用場景
12，display:inline-block 什么時候不會顯示間隙？
13，行內元素float:left后是否變為塊級元素？
14，如果需要手動寫影片，你認為最小時間間隔是多久，為什么？
15，display:inline-block 什么時候會顯示間隙？
16，CSS權重，計算規則
17，Sass、LESS是什么？大家為什么要使用他們？
18，stylus，sass，less區別
19，rgba() 和 opacity 的透明效果有什么不同？
20，px和em的區別
21，使用css實作一個持續的影片效果
22，重排和重繪
23，什么情況會觸發重排和重繪？
…

JavaScript

1，說幾條JavaScript的基本規范
2，閉包
3，變數物件
4，作用域
5，說說你對作用域鏈的理解
6，JavaScript原型，原型鏈 ? 有什么特點？
7，什么是事件委托
8，類的創建
9，如何實作繼承？
10，談談This物件的理解
11，事件模型
12，new運算子具體干了什么呢?
13，Ajax原理
14，Ajax解決瀏覽器快取問題
15，如何解決跨域問題?
16，說說你對AMD和Commonjs的理解
17，js的7種基本資料型別
18，介紹js有哪些內置物件
19，JS有哪些方法定義物件
20，你覺得jQuery原始碼有哪些寫的好的地方
21，null，undefined 的區別
22，談談你對ES6的理解
23，面向物件編程思想
24，如何通過JS判斷一個陣列
25，異步編程的實作方式
26，對原生Javascript了解方向
27，sort 快速打亂陣列
28，陣列去重操作
29，JS 原生拖拽節點
30，深拷貝、淺拷貝
31，節流防抖
32，變數提升
33，JS中的垃圾回識訓制
34，如何理解前端模塊化
35，js單執行緒
36，說說event loop
37，描述下this
38，ajax、axios、fetch區別
…

3，演算法知識

把演算法單獨拿出來，是因為近年來在大廠的面試中對資料結構和演算法的考察越來越重視，
演算法和資料結構的學習是很有必要的，雖然對于前端崗位的演算法要求可能不會那么高，但是基本的遞回、遍歷、鏈表的操作、堆疊與佇列的常見演算法還是要會的，

• 時間復雜度
• 位運算
• 左移 <<
• 算數右移 >>
• 按位操作
• 排序
• 冒泡排序
• 插入排序
• 選擇排序
• 歸并排序
• 快排
• 堆排序
• 系統自帶排序實作
• 鏈表
• 二叉樹的先序，中序，后序遍歷
• 遞回實作
• 非遞回實作
• 中序遍歷的前驅后繼節點
• 樹的深度
• 動態規劃
• 斐波那契數列
• 背包問題
• 最長遞增子序列
• 字串相關

有需要面試題可以點擊這里免費獲取《前端基礎面試題》，《前端校招面試題精編決議大全》，《前端面試題寶典》，《前端面試題：常用演算法》PDF完整版

4，整理面試題

整理面試題，不是讓大家去只刷面試題，而是熟悉目前實際面試中常見的考察方式和知識點，做到心中有數，也可以用來自查及完善知識體系，