前言

• 筆者的一個好友（女生），學歷普通一本，非科班出身，在國內一家大型外包公司上班
• 因遲遲無法轉正成為正式甲方員工（當初入職的時候承諾，有一定的機率轉正成為甲方員工）
• 且在這家公司認真工作了三年多了，三年只漲工資500塊錢
• 遂在六月份開始準備跳槽去甲方
• 歷時將近三個月，總算是在8月底拿到了自己滿意的offer
• 一共是通過了9家的面試，其中有6家是外包公司（練手的面試）
• 當然，外包的公司，在通過後，沒有接對方的offer，以免耽誤對方招聘
• 拿到了三個甲方的offer，分別是17.8K、18K、19K（她當前是15K）
• 最終她選擇去了18K的這家公司（17.8K的公司HR説可能會有大小周的情況、19K的公司是初創型公司應該會稍微辛苦一些）
• 特此分享其面試過程中的一些細節

感謝她提供的文章素材，涉及到個人隱私，簡歷和offer文章不展示

在職跳槽——平衡面試安排

• 首先，她因為是在職狀態，不方便頻繁請假
• 所以，儘量是和麪試官溝通，電話面試+視頻面試
• 能不去對方公司，就不去對方公司
• 實在是必須去現場的時候，才會調休請假下午半天動身前往
• 且，會在這個下午半天，提前協調好公司面試時間，規劃好路線
• 風馳電掣般面試至少兩家公司，將效率提到最高
• 面試中錄音，面試後及時覆盤
• 針對於面試中，遇到的自己不會的問題，當天就爭取將其研究明白
• 用她的話説，面試也是學習，查漏補缺的過程

面試策略——從外包公司練手開始

• 筆者朋友因為三年多面試了，所以，簡歷還是以往老舊的版本（主Vue副React）
• 在花費了一週多，更新簡歷項目後
• 於是，從外包開始練手（找面試感覺）
• 在面試的過程中，再適當去優化完善自己的簡歷內容
• 經過六月份的前期練手後
• 在七月上旬，感覺到自己練手工作已經完成的差不多了
• 於是，便開始投遞甲方公司（部分公司的招聘流程有些長...）
• 經過一輪、二輪、三輪甚至還有四輪面試（聽老闆講未來公司發展前景...）
• 最終，拿到offer選擇覺得合適自己的公司入職

面試中，印象深刻的幾個問題

問題一：一個數據加工後端説是前端做，前端説是後端做，你如何溝通

• 筆者朋友的回答是：如果後端時間多一些，就商量讓後端加工，如果前端時間充足，就前端幹
• 面試官：要做好開發規範，你不要當一個老好人，啥活都往自身上攬，所有數據加工的操作，都要儘可能讓後端操作。比如，菜單的樹結構數據，後端數據庫存儲的是一條又一條數據，通過parentId去關聯子節點，後端還是應該要加工好一個樹結構的數據返回給前端的，不能説讓前端加工。

筆者朋友連連點頭，內心吐槽，後端要是不好商量，不聽也沒辦法呀，加工的活還是得有人幹呀

問題二：有一個需求很緊急，加班也幹不完，你如何處理

• 筆者朋友的回答是：評估具體需要延期多久，儘可能趕一趕加加班，把延期部分的需求，延期上線，已經做完的需求先上線，若是這一版本啥都不上線，的確不太合適
• 面試官：你思考的重點應該是為何會出現很緊急的需求，加班也幹不完的情況，不要本末倒置

筆者朋友連連點頭，內心吐槽，前端開發人微言輕，產品硬塞一個需求，也只能儘可能趕一趕咯

問題三：你是什麼星座？

• 筆者朋友有些懵...
• 面試官：比如雙魚座的人，性格就有些脆弱，抗壓能力就不行

筆者朋友連連點頭，內心吐槽，星座命格真的靠譜嗎？要不要來點占卜？（面試官是一個女生）

問題四：如果你接手的項目寫的很爛，這種情況下你會如何處理？

• 筆者朋友的回答是：首要是保證項目正常運行，新需求，儘量規範起來，往事不諫，來者可追
• 面試官：你要儘量想辦法，把爛代碼變成高可用的代碼，要膽大心細，去優化完善這些爛代碼，這樣才能體現你的價值

筆者朋友連連點頭，內心吐槽，詩山代碼上雕花嗎？這...

話不多説，以下是她遇到的部分面試題，大家參照一下，看看是否都會，都能回答上來

面試題

一號面試

• 預覽功能，用的是什麼技術？前端怎麼實現？怎麼不讓後端實現
• 大文件上傳用的哪個庫？還有其它包嗎？是怎麼實現説思路？
• 自動化腳本寫過嗎？怎麼實現的？
• 如何處理git回退版本的情況？
• Vue2和Vue3的區別？瞭解過她們的diff算法區別嗎？
• JS和TS的區別？
• Vue3模板語法和JSX哪個性能更好一點？
• nodejs的express框架，簡單介紹一下
• Vue裏面的指令
• Vue組件通信方式
• Vuex或者pinia説一下數據的流轉方式
• Vue2的時候有遇到什麼問題，怎麼解決的？-->最近項目中遇到什麼問題，怎麼解決的
• 寫React用的函數式，常用的hooks都説一下
• Webpack和Vite的區別
• Webpack項目大了，包大了，冷啓動和熱更新慢了，有什麼方案？
• Vite的缺點，技術選型的時候都得考慮
• 微前端用的乾坤？父應用和子應用如何通信？iframe通信如何實現的？
• nginx裏面有哪些API？
• nginx的應用場景
• node裏面如何新開一個線程？主線程和子線程是怎麼通信的？
• js數據基礎類型？Map和對象有什麼區別？
• 如何判斷數據類型？
• “==和===的區別”
• 隱式轉換的東西
• 項目平時是怎麼管理的?
• revert 和 reset的區別
• --host和--hard的區別
• 説説git的stash
• Webpack配置哪些東西?從0到1配置哪些東西

二號面試

• 簡單的講一下，技術上自己的優勢，作為前端的開發自己的特長和優勢
• 開發任務時候怎麼樣的思考模式
• 這個思考方式的優勢是什麼？
• 期望的環境和團隊
• 第一個項目週期，時長，在項目中的工作和角色
• 數據加載這個難點，是怎麼去想到這個問題的，
• 技術上怎麼去實現觸底加載的功能的，邏輯怎麼實現的
• 這個項目整體結束後，學到了什麼，自己有什麼成長
• 介紹一個曾經做過的項目
• 加載慢，為什麼慢？如何分析，你的分析手段是啥？
• 現在會如何去優化小程序
• css3的一些特性
• flex佈局實現哪些功能上，結合具體的項目去介紹
• 自適應用到哪些技術點
• 項目開發中常見的ES6的語法
• ES6深拷貝
• 你自身還有什麼不足
• 你的職業規劃，
• 最近研究的問題
• RBAC,瞭解到其它的角色模式嗎
• promise.all
• 對數字孿生的瞭解，就是大屏
• 我的問題
• 良好的編碼習慣，code review咋做的

三號面試

• 介紹一個你的項目，挑一個你認為是自己做的比較複雜的，詳細講一下用到的技術棧、遇到的問題及如何解決的
• 剛剛提到的文件預覽的難點在哪裏
• 打開美團APP看首頁，你從前端開發的角度，你認為可以封裝的組件有哪些？
• 美團購物車這個頁面，組件會怎麼設計？
• 組件中消息傳遞如何設計？
• 現在開發一個管理系統，系統中會用到表格展示數據，不同頁面需求有差異，有的要排序，有的要可選，列配置不同，自定義單元格渲染，你如何設計一個可複用組件滿足這些需求？
• 實際項目中，有沒有處理過這種表格組件業務邏輯解耦
• 有做過優化嗎？（性能優化）
• eachrts提供的渲染模式有哪幾種？
• 項目中有遇到跨域的問題嗎？如何解決？
• 詳細講一下，從瀏覽器接收到html到完成渲染的過程
• 如何控制緩存
• 你的優勢是啥
• 短板和長板
• 一個數據加工後端説是前端做，前端説是後端做，你如何溝通
• 有一個需求很緊急，加班也幹不完，你如何處理

四號面試

• 做過這麼多項目，挑一個你覺得自己做的比較好的項目講解一下
• 談談你對大模型的理解
• 現在有一個數字人功能，你的思路是啥
• package.json生命週期
• vite插件開發過嗎？
• webpack構建有很多過程，你認為你寫的這個loader是在什麼時機執行的？
• webpack執行過程知道嗎？
• 你項目中遠程大數據下拉框 的觸底加載是如何實現的？觸底加載的三個高度，你記得是它們的關係嗎？
• 觸底加載除了滾動條監聽，還有其它方法嗎？
• Vue2和Vue3的區別？
• 説一下Vue2的mixin
• mixin中屬性方法和組件內屬性方法衝突，如何處理？
• mixin中生命週期和組件內生命週期衝突，如何處理？
• mixin在Vue3中怎麼用？
• ElementPlus的tree組件，如果讓你去設計，你會如何設計？
• 給你一個tree的數據結構，深度不知道，渲染出來，渲染過程如何實現？
• dfs和bfs
• 三欄佈局，左右兩邊固定，中間自適應，如何實現？
• 用flex：1，那兩邊寬度大，內容較少，中間寬度小，但內容較多，會出現什麼情況？
• 除了flex可以實現，還有用別的方式實現嗎？
• 定位，A元素相對窗口絕對定位，A元素有子集B也是絕對定位，子集B最後是相對於 誰 定位的？

五號面試

• 自我介紹和最近1-2個核心項目擔任的角色和職責
• 我的問題偏原理和概念比較多，你的回答可以多偏向這個方面。
• Vue3的響應式系統是怎麼工作的，和Vue2的區別是什麼？
• Vue組件間的通信方式有哪些？
• Vue裏面虛擬DOM是什麼？
• Vue項目做性能優化主要關注哪些點或者説怎麼做？
• Vue中ref和reactive有什麼區別?
• Vue中的key屬性的作用是什麼？
• 封裝過哪些組件，介紹一下有亮點的組件
• Vue組件的懶加載是怎麼做的
• Vue第一次進入頁面會觸發哪幾個生命週期
• 介紹一下插槽的類型和作用
• 計算屬性和watch的區別和應用場景是什麼？
• Vue中路由實現hash和history模式的區別介紹一下
• 介紹一下Vue-Router的跳轉是怎麼跳的
• 介紹一下Keep-alive是幹嘛的，使用場景是什麼？
• Vue雙向綁定的原理
• 在複雜系統裏面，講一下狀態管理方案和思路
• Vue的代碼分割做過嗎？大概介紹一下
• 代碼分割的目的是什麼？
• 我們這次對前端的標準化構建要求比較高，項目從開始到落地整個前端工作過程中，對標準化，工程化，流程化有要求的話，你覺得要注意的關鍵點有哪些？

六號面試

• 第一份工作2年的時間做的是什麼項目呢？
• 為什麼從第一家公司離開呢？
• 任選一個你的項目介紹一下，説你自己做的部分
• 你做的效能開發工具，後面有評估節省了多少時間嗎？
• 你為什麼想要從現在這家公司離職
• 這三年你有學新的東西嗎？當前公司
• 你做的最大的項目簡單介紹一下
• 你想找一個什麼樣的工作？
• 項目中要和產品，UI，後端配合，你認為哪一個崗位最好溝通，哪一個最難溝通？
• 你做過這麼多種類的項目，你個人更喜歡哪一類的項目？
• 你是什麼星座？
• 如果項目上線前，發現一個非技術問題，比如説一個重要流程沒考慮到，時間又很緊，你會怎麼處理？
• 團隊如果有人對你的技術選型有不同的意見，你怎麼溝通和處理？
• 你是非計算機轉行過來的，你這個背景有沒有給你帶來獨特的視角？
• 你認為你現在跟入行時候有什麼區別？
• 你認為你身上有你團隊人員喜歡和信賴的點是什麼？

七號面試

• 目前在職還是離職？
• 選一個你的項目講一下背景，功能，你負責的模塊，遇到過哪些難點和問題，如何解決的？
• 為什麼要把文件給到後端，讓後端去存minio，為什麼不直接從前端往minio裏面存呢？
• 請求失敗重試如何實現
• 請求併發，和請求順序控制
• 講一下xx項目的性能優化
• 雪碧圖，具體怎麼實現，具體css代碼是啥
• 緩存到底是存在那個地方？
• memory cache 和 disk cache
• 用户看到A屏幕時，有沒有什麼辦法把後面B屏和C屏的內容加載？
• 強水印功能如何實現的？這個API換個IE瀏覽器可能就失效了，有什麼方案解決嗎？
• nodejs可以做後台服務器，做過哪些服務？
• 接手老項目，封裝requet請求就是http請求的包，在項目中有一層封裝叫request.js，request.js中使用axios的包做http請求，你有一個新功能，有一個接口超時時間長，超過10s，老代碼裏面默認全局超時是10s，新功能受限，會報錯超時，需要你把request.js再次封裝，達到2個目的，
  1、不指定超時時間時，超時時間默認10s
  2、需要指定時間時，超時時間為20s
  如何封裝這個request.js實現這個功能
• 有5000支股票，每3秒從中挑選出2000支股票的數據實時刷新頁面，如何才能快速篩選。
• 現在 讓你重構一個項目，你的策略有哪些？

八號面試

• 中間層瞭解過嗎
• 有處理過大模型數據不是一次性返回的的嗎？流式返回數據瞭解過嗎
• 大文件分片上傳怎麼處理的？
• 講一下你寫的這個效能工具
• Vue3和Vue2的區別
• 為什麼Vite比Webpack快？
• 你寫的這個自定義loader為什麼要這麼做？
• 你項目中做了哪些性能優化？
• 你的虛擬列表是怎麼處理的？
• CSS一般是怎麼寫的？用到過tailwind嗎？
• 若依框架是用的全部，還是隻用的前端？瞭解過它登錄時的加密算法嗎？
• Vue3的Watch和WatchEffect的區別
• Vue3的組件通信方式有哪些？
• Pinia相對Vuex好在哪些地方？
• TS用的多嗎？
• 模板編譯原理了解過嗎？源碼看過嗎？
• 頁面中有併發請求，是怎麼處理的？
• 有做請求的隊列方式嗎？
• 對ElementPlus有封裝過組件嗎？
• 通用的組件，是從一個項目copy到另一個項目嗎？
• 除了若依框架，還用過其它的成熟框架嗎？
• 談談你對低代碼平台的理解
• 談談你對0代碼平台的理解

九號面試

• 項目工作情況，個人優勢，先介紹一下
• 有用過流程引擎，表單引擎嗎？
• 你做過的大一點的項目的人員配比
• 項目的工作流程
• 個人作品有嗎？
• 為什麼要離職？
• 現在公司加班多不多？
• 原生js實現lcp
• 寫一個冒泡排序，還有別的排序方式嗎
• react路由、redux
• 函數式組件和類組件
• react和vue涉及的理念，談談
• 談談你對於技術選型的理解
• 你的組員對於某個技術選型有着不同的理解，你如何安排協調溝通
• 你有產品思維嗎？或者説前端應該涉足產品設計嗎？
• 前端應該涉足後端設計嗎
• 你會自測嗎？你如何把控代碼質量
• 是什麼完美的沒有任何bug的性能高效的廢代碼？
• 談談對面試百度編程的理解
• 接觸的項目都是從0到1還是半路接手的？
• 半途接手項目，如何快速熟悉項目，做開發任務？
• 如果你接手的項目寫的很爛，這種情況下你會如何處理？

十號面試

• 數據data為什麼是一個function
• 用過mixin嗎？
• vue3的setup和create先執行？
• 介紹封裝組件
• 説説插槽的使用場景
• 大文件上傳你是如何實現的？
• 文件預覽組件你是如何實現的？
• vue3組件通信，$attr是如何使用的？父組件訪問子組件的一些方法啥的，需要什麼條件？
• v-model實現原理
• ref和reactive區別，從底層原理説下
• v-if和v-show的區別
• 三次握手為什麼要比四次揮手少一次
• 瀏覽器輸入url發生了什麼
• 狀態碼説一下，工作中具體遇到的狀態碼
• 項目發佈使用docker嗎
• 説一下鏈表的具體應用場景
• 你刷了多少道算法題？算法場景題
• 手寫一個深度克隆
• 比較兩個對象是否相等
• 為何有閉包這個東西，它解決了什麼問題
• 你如何看待加班？
• 你有什麼想要問我的嗎？

好友的總結

以下，來自筆者好友的總結

• 面試中，時有沮喪，失落，時而我又可以了。
• 但是！！
• 每天堅持學習，你可以打敗10%的人，
• 每天堅持投遞，你又打敗10%的人，
• 每場面試錄音回顧，你又打敗20%的人，
• 你堅持動作一個月，你又打敗10%的人。
• 你已經打敗一半的人啦！！！
• 好的面試官，確確實實使人如沐春風。
• 好的面試，錄音反覆聽，讓人回味無窮，且温故而知新。
• 感謝給面試機會的公司，面試中願意解釋，願意引導的面試官！！