字節跳動前端崗位面試分享（已拿offer）

一個朋友的分享

秋招，有幸去字節面試了，順便拿到了offer，把還記得東西寫下來，供你們參考一下。

一面

• css 如何實現垂直居中？
• position 有哪幾種？分別說一下對應的效果和用法
• css 選擇器優先級
• js 原型鏈，問了js 如何建立對象
• 頁面渲染和響應 式
• MVVM 和 MVC的區別
• Vue 生命週期，在哪一個階段能夠獲取頁面 dom 信息
• Vue 的組件通訊 ，聊到一些網絡相關
• TCP 和 UDP 的區別
• TCP 的三次握手和四次揮手
• promise 有哪幾種狀態
• 手寫一個 promise
• 算法題：最長公共前綴
• 算法題：多層數組嵌套降級

二面

• 問項目的狀況

根據項目問了一點個人工做，接觸前端有多久，在每一個項目裏學到了什麼，沒作項 目的時候學了什麼，怎麼學的這樣的問題，而後開始就是實戰寫代碼

• css 實現

給一個具體的需求寫 html+css，需求大概是模塊水平垂直居中對齊+不 定高，按文字自適應+帶灰色遮罩+彈出動畫

• css 的動畫怎麼作
• flex 有哪些經常使用標籤
• position 的屬性影響
• 具體實現，給一個 ul 下面插入 100 個 li 應該怎麼插入，如何優化 dom 操做
• 具體實現：有一個有一百萬個 url 的數組，如何從這一百萬個 url 裏得到資源
• 算法：判斷鏈表內是否存在環

整體上字節的二面特別看重具體實現，會說思路不夠，須要真正的寫出能夠實現 的代碼來。通常算法就是 leetcode 的 easy/medium，不會太難，一些基本概 念也會挖的比較深，整體上說仍是頗有難度。

三面

以前都是先問基礎，此次很可貴的從一面就開始問項目了！

• http 請求的幾個常見方法
• 說下 get 和 post 的區別
• get 和 post 的具體應用場景和一些注意事項
• 線程和進程的區別
• 說下跨域
• http 簡單請求是什麼意思
• 瀏覽器緩存策略
• TCP 和 UDP 的區別
• 瞭解流媒體對 UDP 穩定性的優化處理嗎
• js 的基本數據類型
• 哪些操做是異步的？
• promise 的一些基本概念
• async await 的一些用法
• js 繼承的幾種方式
• 排序算法的時間複雜度空間複雜度
• 作個題，實現鏈表尾部插入新節點
• 算法題：版本號判斷

四面

• 大概問了一些項目相關問題，好比印象比較深的技術點，怎麼學習的和解決 的 balabala
• css 的垂直居中和水平居中
• css 選擇器優先級
• html 的 dom 樹如何生成的
• 小程序和 pc 頁面有什麼差別（由於項目裏寫了小程序）
• 項目裏的一些性能優化的點
• 作個題，看代碼是否能完成輸出，若是不能就說下幾個改的點（題太長了沒記）
• 代碼實現：設計一個任務隊列，有 on，trigger 和 off 方法，分別完成註冊 事件觸發回調，觸發當前事件所有回調，和取消當前事件的任務隊列的功能

hr 面

• 看了個人投遞記錄發現我來字節面了這麼屢次問我這幾回有什麼進步，學了什麼
• 字節的面試體驗怎麼樣
• 有沒有考研的打算，爲何？
• 介紹一下簡歷上的三個項目，爲何要選這三個項目進行展現？
• 在項目中學到了哪些東西，有什麼心得體會
• 怎麼學習前端的，怎麼規劃將來學習
• 小組合做中的壓力怎麼應對的，若是要面對失敗會怎麼調節
• 大概何時能夠來，能夠來實習多久？

看了上面的面試題，下面也分享一些大佬蒐集整理的前端面試題，上面的題目大多都有包含。PDF文檔整理有不少，篇幅緣由就不都列舉出來了。有須要能夠私信哦！

html

1，瀏覽器存儲的方式有哪些
2，如何解決跨域的？
3，瀏覽器 cookie 和 session 的認識。
4，輸入URL發生什麼？
5，瀏覽器渲染的步驟
6，頁面渲染優化
7，強制緩存和協商緩存
8，GET 和 POST 請求的區別
9，HTTP1.0 / 1.1 / 2.0 及HTTPS
10，介紹下304過程
11，HTTP 狀態碼
12，Web性能優化

css

1，盒模型
2，如何實現一個最大的正方形
3，一行水平居中，多行居左
4，水平垂直居中
5，兩欄佈局，左邊固定，右邊自適應，左右不重疊
6，如何實現左右等高佈局
7，畫三角形
8，link @import導入css
9，BFC理解

js

1，判斷 js 類型的方式
2，ES5 和 ES6 分別幾種方式聲明變量
3，閉包的概念？優缺點？
4，淺拷貝和深拷貝
5，數組去重的方法
6，DOM 事件有哪些階段？談談對事件代理的理解
7，js 執行機制、事件循環
8，介紹下 promise.all
9，async 和 await,
10，ES6 的 class 和構造函數的區別
11，transform、translate、transition 分別是什麼屬性？CSS 中經常使用的實現動畫方式,
12，介紹一下rAF(requestAnimationFrame)
13，javascript 的垃圾回收機制講一下,
14，對前端性能優化有什麼瞭解？通常都經過那幾個方面去優化的？

vue

1，Vue 雙向綁定原理,
2，描述下 vue 從初始化頁面--修改數據--刷新頁面 UI 的過程？,
3，你是如何理解 Vue 的響應式系統的?,
4，虛擬 DOM 實現原理,
5，既然 Vue 經過數據劫持能夠精準探測數據變化,爲何還須要虛擬 DOM 進行 diff 檢測差別?,
6，Vue 中 key 值的做用？
7，Vue 的生命週期,
8，Vue 組件間通訊有哪些方式?,
9，watch、methods 和 computed 的區別?
10，vue 中怎麼重置 data?,
11，組件中寫 name 選項有什麼做用？
12，vue-router 有哪些鉤子函數?
13，route 和 router 的區別是什麼？
14，說一下 Vue 和 React 的認識，作一個簡單的對比
15，Vue 的 nextTick 的原理是什麼？
16，Vuex 有哪幾種屬性?
17，vue 首屏加載優化
18，Vue 3.0 有沒有過了解？
19，vue-cli 替咱們作了哪些工做？