大廠前端面試都問些什麼問題？入職愛奇藝年薪48萬，面試經驗總結

時間 2019-11-06

標籤大廠前端面試什麼問題年薪經驗總結欄目快樂工作简体版

原文原文鏈接

前言

「金九銀十「跳槽季，又到了面試求職的高峯期。好多小夥伴都會跳槽去找工做。若是你不跳槽，也建議把這篇文章看完，畢竟金九銀十以後，就是金三銀四了，老是逃不掉的css

你在面試的時候，是否遇到過如下問題：html

各大招聘網站海投簡歷，給迴應的寥寥無幾
永遠想不明白到底該不應去外包公司
面試前不知道該作哪些準備，常被面試官問到發懵
不知道怎麼談薪資，可讓本身利益最大化

若是你中了其中2條以上，那本文必定要認真讀完。

從9月開始，我分別面試了百度、快手、愛奇藝、阿里、滴滴、字節跳動、好將來、貝殼等8家互聯網大廠，順利拿到4家offer，並最終入職愛奇藝，年薪48萬。

本文記錄了以上8個互聯網大廠的面試題目，帶你全面瞭解——【最近，前端面試都問些什麼】前端

百度vue

一、請分析如下代碼執行結果node

二、請分析如下代碼執行結果react

三、請寫出 inner 的實際高度。linux

四、手寫一個深拷貝函數。webpack

五、HTTP 狀態碼 301 302 304 403。程序員

六、手寫發佈訂閱模式 EventEmitter。web

七、手寫一個多表查詢的 sql 語句。

當時用的是 left join 實現。

八、react 高階函數的寫法，一般有哪幾種。

第一種是經過工廠模式直接 wrapper，第二種是經過組件反向繼承的方式。

九、delete 數組的 item，數組的 length 是否會 -1。

不會。

十、mongoDB 中的 BSON 是什麼？

B 表明二進制。

十一、關係型數據庫和 nosql 查詢效率誰高？

關係型是 B+ tree 查詢效率相對較高。

十二、使用 node app.js 開啓服務，如何讓它在後臺運行。

開啓守護進程，在命令後加上 & 符號，表示開啓守護進程來執行。

1三、儘量寫出更多的數組反作用方法。

splice、push、pop、shift、unshift。
sort、fill、reverse。

百度三面：

一、實現一個週歲函數，例如 fn('2018-8-8') 輸出 1，只要是過了生日就 +1。

二、不斷優化剛纔實現的函數，用盡一切辦法，多問一問還有嗎？跳出本身的固定思惟圈。

阿里

一、vue 雙向數據綁定原理，依賴收集是在何時收集的？

是在 created 生命週期以前，render 生成虛擬 dom 的時候。

二、react hooks 原理是什麼？

hooks 是用閉包實現的，由於純函數不能記住狀態，只能經過閉包來實現。

三、useState 中的狀態是怎麼存儲的？

經過單向鏈表，fiber tree 就是一個單向鏈表的樹形結構。

React Hooks 原理

快手

一、請寫出如下代碼執行結果。

二、請寫出如下代碼執行結果。

三、ts 如何獲取一個函數的類型，以及獲取一個函數參數的類型。

四、ts 泛型約束的多種方法。

五、parseInt 的第二個參數是什麼？

第二個參數表示將字符串當作幾進制進行解析。

六、實現一個多列等高佈局，多種方式。

使用 padding 和負 margin
使用 flex
使用 table-cell
使用 grid 佈局

七、函數提高，若是加了一個括號，還會提高嗎？

不提高。

八、setTimeout 的第三個參數，能夠傳遞函數的初始參數。

九、bind 函數的第二個參數，能夠傳遞函數的初始參數。

十、使用 ts 時，若是不在 a 後面加類型，怎麼建立一個 number[] 的數組？

十一、react 源碼看過嗎，<Component1 /> 最後編譯出來是個什麼東西，是個什麼類型？

ReactElement 類型。

愛奇藝

一、瀏覽器渲染 js，html，css 的順序。

二、react dom diff 算法，list 比較首先比較的是什麼？

首先比較同層級元素，從左到右。

三、爲何 react 要作成異步的呢？

由於 state 更新會致使組件從新渲染，在渲染後，才能把新的 props 傳遞到子組件上，因此即便 state 作成同步，props 也作不成，爲了保證 state 和 props 的一致性。
爲了性能優化，state 會根據不一樣的優先級進行更新。
爲了讓 react 更加靈活，如實現異步過渡，例如頁面在切換的時候，若是延時很小，就在後臺自動渲染了，渲染好以後再進行跳轉；若是延時相對較長，能夠加一個 loading。

四、對象的 {…} 解構，是 rest 嗎？

是。

五、本身實現一個 Symbol Interator 。

六、options 頭是在何時會進行發送。

檢測服務器所支持的請求方法
CORS 中的預檢請求

七、sessionStorage 在兩個 tab 窗口能共享嗎？

不能，和後端的 session 相似，每個窗口對應一個會話層。

八、localStorage 存放的只能是 string 類型。

插入時須要將對象轉換爲字符串，讀取時須要作 JSON.parse 轉換。

九、寫一個 0-100 的正則表達式。

十、linux 中怎麼查看內存和磁盤。

top 命令，查看內存。
free 命令，查看內存。
ps aux 列出當前內存中正在運行的程序。
df 命令，查看磁盤。

十一、meta 標籤用過嗎，都用來作些什麼？

seo 優化
viewreport 設置手機端適配
設置 charset 字符編碼
模擬 http 標頭字段

滴滴

一、快速排序和二分排序選一個手寫。

手寫了一個快排。

二、手寫一個 eventEmitter。

三、手寫兩個數組的交集。

兩層 for 循環。
將兩數組排序後，使用雙指針去判斷。

四、webpack 運行流程，seal 方法以後都有什麼？何時生成 chunk ？

五、ts 中 ThisType <T> 是什麼？

ThisTypeT

六、手寫一個 es5 繼承。

寄生組合繼承

七、react hooks 主要用來作什麼？

在組件之間複用狀態邏輯很難
你可使用 Hook 從組件中提取狀態邏輯，使得這些邏輯能夠單獨測試並複用。Hook 使你在無需修改組件結構的狀況下複用狀態邏輯。這使得在組件間或社區內共享 Hook 變得更便捷。
複雜組件變得難以理解
組件中的每一個生命週期經常包含一些不相關的邏輯。Hook 將組件中相互關聯的部分拆分紅更小的函數（好比設置訂閱或請求數據）。
難以理解的 class
class 組件學習成本相對較高，須要理解 this 在 js 中的工做方式，在綁定事件時須要注意。

hooks 介紹

八、https 有什麼缺點？