前端三年到五年面試題分享

筆試：

都是些基礎選擇題，考察計算機網絡，事件循環機制，閉包，this 這些。

一面：

三次握手和四次揮手詳細介紹

TCP 有哪些手段保證可靠傳遞

URL 從輸入到頁面渲染全流程

如何預防中間人攻擊

DNS 解析會出錯嗎，為什麼

ES6 的 Set 内部實作

如何應對流量劫持

算法：top-K 問題，分成 top-1,top-2,top-K 三小問

二面：

跨域

webpack 的 plugins 和 loaders 的實作原理

vue 和 react 談談差別和選型考慮

webpack 如何優化編譯速度

事件循環機制，node 和浏覽器的事件循環機制差別

三面：

單元測試編寫有哪些原則

一個大型項目如何配置設定前端開發的工作

怼項目

同樣都是基礎題，注意有兩道算法：柯裡化通用實作和 two-sum 問題。

typescript 有什麼好處

vue 項目中如何限制 rxjs 資料的類型

rxjs 高階資料流定義，常用高階資料流操作符

二三面：

圍繞着我的履歷問項目細節，側重于 rxjs 和 typescript 這塊内容。

JWT 優缺點

選擇器優先級

基本資料類型

RxJS 冷熱流差別

RxJS 調試方法

nginx 負載均衡配置

前端性能優化手段

針對 React 的性能優化手段

301 302 307 308 401 403

vue 的 nextTick 實作原理以及應用場景

vue 元件間通信

談談 XSS 防禦，以及 Content-Security-Policy 細節

場景題：一個氣球從右上角移動到中間，然後抖動，如何實作

場景題：一個關于外邊距合并的高度計算

mobx-react 如何驅動 react 元件重渲染

forceUpdate 經曆了哪些生命周期，子元件呢?

React key 場景題：清單使用 index 做 key，删除其中一個後，如何表現？

算法：實作 setter(obj, ‘a.b.c’ ,val)

RxJS 相對于其他狀态管理方案的優勢？

手寫冒泡排序

JWT 細節，适用場景

方案題：不同前端技術棧的項目，如何實作一套通用元件方案？

ES6 特性

閉包和 this 一起談談

postcss 配置

Promise 内部實作原理

vuex, mobx, redux 各自的特點和差別

react 生命周期

各方面談談性能優化

serviceworker 如何保證離線緩存資源更新

virtual dom 有哪些好處

然後換了個有黑闆的面試間，狂怼項目，各方面都問到了。

總監面，把剛才一黑闆的項目架構圖全部擦掉，再來談一遍。

Vue3 proxy 解決了哪些問題？

Vue 響應式原理

釋出訂閱模式和觀察者模式的異同

圖檔懶加載實作

css 垂直居中

CI/CD 流程

談談性能優化

key 的作用

hooks

vue 和 react 差別，選型考慮

canvas 優化繪制性能

webpack 性能優化手段

事件循環

如何解決同步調用代碼耗時太高的問題

手寫 Promise 實作

場景題：如何實作登入功能

聊項目

Promise 實作原理

性能優化

vuex 資料流動過程

談談 css 預處理器機制

算法：Promise 串行

CI/CD 整體流程

SSR 對性能優化的提升在哪裡

react 和 vue 更新機制的差別

Vue3 proxy 的優劣

symbol 應用

深拷貝

dns 解析流程

vue 和 react 選型和比較

ssr 優缺點

貝塞爾曲線

Vue3 proxy 優缺點

Vue 元件間通信

ssr 性能優化，node 中間層細節處理

這一面比較特别，和之前的面試都不太一樣，是知乎早已關注很久的之昊老師面的。

之前的面試大概是屬于主導權在我這邊，面試官傾聽的比較多，搭配上少量提問。而這一面基本全程處于被之昊老師教育加吊打的狀态，感覺之昊老師說的話比我還多了，針對問出的每個點會在我回答的基礎上做更多的延伸說明，沒有局限到具體的技術方案或者細節代碼，更多的是談到了一些方法論或者說作為一個優秀的開發者面對一些問題時比編碼更高的思維層面上的處理方式。收獲很大，聊到了很多之前工作中都沒有考慮過的東西。這就是大佬的世界嗎.jpg。

如何編寫 loaders 和 plugins

webpack 熱更新原理

vue 和 react 元件通信

談談 eleme 架構源碼

談談項目

個人興趣愛好

筆試題

第一題：将數組扁平化并去除其中重複資料，最終得到一個升序且不重複的數組

第二題:

說明：實作一個方法，用于比較兩個版本号（version1、version2） 如果version1 > version2，傳回1；如果version1 < version2，傳回-1，其他情況傳回0 版本号規則x.y.z，xyz均為大于等于0的整數，至少有x位 示例： compareVersion(‘0.1’, ‘1.1.1’); // 傳回-1 compareVersion(‘13.37’, '1.2 '); // 傳回1 compareVersion(‘1.1’, ‘1.1.0’); // 傳回0

第三題：找到字元串中最大回文子串，例如 ‘3434356’ 的最長回文子串是 ‘34343’。回文是指對稱的字元串，如：‘abccba’。找到字元串中最大回文子串

面試題

我做一個搜尋，實時的去進行篩選資料，做一個簡單的防抖，然後如何保證我的請求回來的結果是我最後一次的查詢條件的結果

一百個異步請求，如何捕捉請求失敗的有哪些，如何擷取最後一個請求結果？