筆者是在去年秋招面試的頭條教育線(xiàn)，順利拿到了offer，把還記得的東西寫(xiě)下來(lái)，供大家參考一下。

【PDF文末拿】

一面：

筆試題
1.如果后端傳給前端一個(gè)很大的數(shù)，前端會(huì)怎么樣，該怎么處理？
2.new的過(guò)程
3.瀏覽器的緩存機(jī)制（強(qiáng)緩存和協(xié)商緩存）
4.用css3寫(xiě)一個(gè)環(huán)形進(jìn)度條
5.一道關(guān)于promise的任務(wù)控制編程題
6.說(shuō)說(shuō)BFC是什么，能解決什么問(wèn)題
面試流程
自我介紹然后說(shuō)一個(gè)印象深刻的項(xiàng)目。。。
1.瀏覽器是怎么加載一個(gè)HTML的（解析dom，css，js過(guò)程。。。）
2.vue-router實(shí)現(xiàn)的原理
3.回流重繪，為什么用transform寫(xiě)動(dòng)畫(huà)不用position top left
4.if...else...多層嵌套怎么解決
5.編程題：n維數(shù)組轉(zhuǎn)換成1維數(shù)組，比如:[1,[2,3],[[4],[5,6]]]變成[1,2,3,4,5,6]
二面：
前端負(fù)責(zé)人面，自我介紹然后聊項(xiàng)目經(jīng)驗(yàn)（一定要講一些出彩的項(xiàng)目，什么難點(diǎn)，如何突破），聊了些工作經(jīng)歷（為什么想換工作，以前的工作有什么收獲，自身的缺點(diǎn)）。。。
技術(shù)題問(wèn)的不多
1.寫(xiě)一個(gè)EventEmitter
三面：
主管面，介紹工作經(jīng)歷，聊項(xiàng)目亮點(diǎn)balabala
1.編程題，在一個(gè)無(wú)序數(shù)組中找到第二大的數(shù)
2.項(xiàng)目設(shè)計(jì)題，寫(xiě)一個(gè)***大戰(zhàn)（寫(xiě)出類(lèi)和屬性方法，不需要實(shí)現(xiàn)）
3.***大戰(zhàn)的各個(gè)動(dòng)畫(huà)是怎么動(dòng)起來(lái)的（游戲引擎怎么運(yùn)作）
4.當(dāng)瀏覽器地址欄輸入一個(gè)url到頁(yè)面展現(xiàn)，這個(gè)過(guò)程？
5.https過(guò)程
6.http和tcp的關(guān)系
四面：
北京交叉面，主要是聊項(xiàng)目（有亮點(diǎn)的項(xiàng)目，涉及架構(gòu)的項(xiàng)目等），工作中做了什么，未來(lái)職業(yè)規(guī)劃是什么，面試官最后還給了一定的建議。
刷過(guò)的題目
下面是我花了將近一個(gè)月的時(shí)間整理的一份面試題庫(kù)。這些面試題，包括我本人自己去面試遇到的，還有在面試之前刷過(guò)的題目，我都統(tǒng)一的整理了一下，希望對(duì)大家有用。
HTML

• 瀏覽器頁(yè)面有哪三層構(gòu)成，分別是什么，作用是什么?

• HTML5的優(yōu)點(diǎn)與缺點(diǎn)？

• Doctype作用? 嚴(yán)格模式與混雜模式如何區(qū)分？它們有何意義?

• HTML5有哪些新特性、移除了哪些元素？

• 你做的網(wǎng)頁(yè)在哪些瀏覽器測(cè)試過(guò),這些瀏覽器的內(nèi)核分別是什么?

• 每個(gè)HTML文件里開(kāi)頭都有個(gè)很重要的東西，Doctype，知道這是干什么的嗎？

• 說(shuō)說(shuō)你對(duì)HTML5認(rèn)識(shí)?（是什么,為什么）

• 對(duì)WEB標(biāo)準(zhǔn)以及W3C的理解與認(rèn)識(shí)?

• ......

CSS

• 解釋一下CSS的盒子模型？

• 請(qǐng)你說(shuō)說(shuō)CSS選擇器的類(lèi)型有哪些，并舉幾個(gè)例子說(shuō)明其用法？

• 請(qǐng)你說(shuō)說(shuō)CSS有什么特殊性?（優(yōu)先級(jí)、計(jì)算特殊值）

• 常見(jiàn)瀏覽器兼容性問(wèn)題與解決方案？

• 列出display的值并說(shuō)明他們的作用？

• 如何居中div, 如何居中一個(gè)浮動(dòng)元素?

• 請(qǐng)列舉幾種清除浮動(dòng)的方法(至少兩種)?

• block，inline和inlinke-block細(xì)節(jié)對(duì)比？

• 什么叫優(yōu)雅降級(jí)和漸進(jìn)增強(qiáng)？

• 說(shuō)說(shuō)浮動(dòng)元素會(huì)引起的問(wèn)題和你的解決辦法

• 你有哪些性能優(yōu)化的方法？

• ......

JavaScript

• js的各種位置，比如clientHeight,scrollHeight,offsetHeight ,以及scrollTop, offsetTop,clientTop的區(qū)別？

• js拖拽功能的實(shí)現(xiàn)

• 異步加載js的方法

• js的防抖與節(jié)流

• 說(shuō)一下閉包

• 說(shuō)說(shuō)你對(duì)作用域鏈的理解

• JavaScript原型，原型鏈 ? 有什么特點(diǎn)？

• 請(qǐng)解釋什么是事件委托/事件代理

• Javascript如何實(shí)現(xiàn)繼承？

• 函數(shù)執(zhí)行改變this

• babel編譯原理

• 函數(shù)柯里化

• 說(shuō)一下類(lèi)的創(chuàng)建和繼承

• 說(shuō)說(shuō)前端中的事件流

• 如何讓事件先冒泡后捕獲

• 說(shuō)一下圖片的懶加載和預(yù)加載

• js的new操作符做了哪些事情

• 改變函數(shù)內(nèi)部this指針的指向函數(shù)（bind，apply，call的區(qū)別）

• Ajax解決瀏覽器緩存問(wèn)題

• ......

由于篇幅限制，展示了部分內(nèi)容截圖，需要完整文檔資料的，文末拿！

Vue

• Vue中 key 值的作用

• Vue 組件中 data 為什么必須是函數(shù)？

• vuex的State特性是？

• 介紹一下Vue的響應(yīng)式系統(tǒng)

• computed與watch的區(qū)別

• 介紹一下Vue的生命周期

• 為什么組件的data必須是一個(gè)函數(shù)

• 組件之間是怎么通信的

• Vue.cli中怎樣使用自定義的組件？有遇到過(guò)哪些問(wèn)題嗎？

• Vue如何實(shí)現(xiàn)按需加載配合webpack設(shè)置

• 簡(jiǎn)單描述每個(gè)周期具體適合哪些場(chǎng)景

• scss是什么？在Vue.cli中的安裝使用步驟是？有哪幾大特性？

• 聊聊你對(duì)Vue.js的template編譯的理解？

• Vue 路由跳轉(zhuǎn)的幾種方式

• Vue如何實(shí)現(xiàn)按需加載配合webpack設(shè)置?

• Vue的路由實(shí)現(xiàn)：hash模式和history模式

• Vue與Angular以及React的區(qū)別？

• Vue路由的鉤子函數(shù)

• 什么是Vue的計(jì)算屬性？

• ......

React

• 介紹一下react

• React單項(xiàng)數(shù)據(jù)流

• react生命周期函數(shù)和react組件的生命周期

• react和Vue的原理，區(qū)別，亮點(diǎn)，作用

• reactJs的組件交流

• 有了解過(guò)react的虛擬DOM嗎，虛擬DOM是怎么對(duì)比的呢

• 項(xiàng)目里用到了react，為什么要選擇react，react有哪些好處

• 怎么獲取真正的dom

• 選擇react的原因

• react的生命周期函數(shù)

• setState之后的流程

• react高階組件知道嗎？

• React的jsx，函數(shù)式編程

• react的組件是通過(guò)什么去判斷是否刷新的

• 如何配置React-Router

• 路由的動(dòng)態(tài)加載模塊

• Redux中間件是什么東西，接受幾個(gè)參數(shù)

• redux請(qǐng)求中間件如何處理并發(fā)

瀏覽器

• 跨標(biāo)簽頁(yè)通訊

• 瀏覽器架構(gòu)

• 瀏覽器下事件循環(huán)(Event Loop)

• 從輸入 url 到展示的過(guò)程

• 重繪與回流

• 存儲(chǔ)

• Web Worker

• V8垃圾回收機(jī)制

• 內(nèi)存泄露

• reflow(回流)和repaint(重繪)優(yōu)化

• 如何減少重繪和回流?

• 一個(gè)頁(yè)面從輸入 URL 到頁(yè)面加載顯示完成，這個(gè)過(guò)程中都發(fā)生了什么？

• localStorage 與 sessionStorage 與cookie的區(qū)別總結(jié)

• ......

服務(wù)端與網(wǎng)絡(luò)

• HTTPS和HTTP的區(qū)別

• HTTP版本

• 從輸入U(xiǎn)RL到頁(yè)面呈現(xiàn)發(fā)生了什么？

• HTTP緩存

• 緩存位置

• 強(qiáng)緩存

• 協(xié)商緩存

• 緩存的資源在那里

• 用戶(hù)行為對(duì)瀏覽器緩存的影響

• 緩存的優(yōu)點(diǎn)

• 不同刷新的請(qǐng)求執(zhí)行過(guò)程

• ......

算法與數(shù)據(jù)結(jié)構(gòu)

• 二叉樹(shù)層序遍歷

• B樹(shù)的特性，B樹(shù)和B+樹(shù)的區(qū)別

• 尾遞歸

• 如何寫(xiě)一個(gè)大數(shù)階乘？遞歸的方法會(huì)出現(xiàn)什么問(wèn)題？

• 把多維數(shù)組變成一維數(shù)組的方法

• 說(shuō)一下冒泡快排的原理

• Heap排序方法的原理？復(fù)雜度？

• 幾種常見(jiàn)的排序算法，手寫(xiě)

• 數(shù)組的去重，盡可能寫(xiě)出多個(gè)方法

• 如果有一個(gè)大的數(shù)組，都是整型，怎么找出最大的前10個(gè)數(shù)

由于篇幅限制，展示了部分內(nèi)容截圖，需要完整文檔資料的，看下圖！