零基礎自學前端人的求職路，面經&資源分享

前言

從 2016年本科畢業開始，一路跌跌撞撞走了很多彎路，在機緣巧合下，走上了前端開發之路，作為一個非計算機專業且學歷一般的人來說，自學編程其實不是件容易的事情，不過慶幸的是自己堅持下來了，

目前作業還算不錯，收入在目前所在的城市不算高，不算低，生活也還過得去，繼續加油努力，也希望自己在今后更上一層，

從2019年下半年開始，我真正接觸前端，到現在一年多的時間，開始之初，我沒有任何的語言基礎，完全從零的小白開始，就連「物件」我都弄不明白，更別說那些高深莫測的什么封裝、繼承、多型等，

當時自己也不知從何入手，怎么辦呢？于是每當自己遇到困難時，就厚著臉皮去請教前輩大牛，然后就是去查閱資料，很多時候自己也很覺得不好意思，現在才發現人很多時候都恥于相別人請教，怕自己丟面子，

但作為一個過來人，我要告訴你請教前輩大牛真的很重要，可以讓你少走很多的彎路，不要怕丟人，沒面子，面子值幾個錢？學到真本事才最重要，沒有技能才叫真的沒有面子，當然了我們在請教別人時，一定要掌握「度」，不要打擾到了別人的作業，

我現在非常感謝前輩們的賜教，也感謝那些在網上寫博客、文章分享的大牛們，給了我們這些自學的小白很多的資料，經驗，心得，從中受益很多，

向優秀的前輩們學習，我開始寫博客，希望也能幫到和我一樣，學渣、從零開始、喜歡技術的一群志同道合的人，

我深知自己的技術并不高，還處在繼續學習的路上，離大牛還差的很遠，我本身也非常敬畏技術，也知道自己的渺小，只希望這篇文章的「學習之路」對于那些「從零開始」學習前端的同學有一些指引作用，不像自己一開始那樣的那么盲目，哪怕對你有一點點的幫助，就足夠了，

說了這么多，下面我們直接進入正題，都是我平時學習和收集的一些面試資料希望能夠幫到你，

面試高頻問題

1、JavaScript

• 講講js資料型別？基本和參考的區別？symbol和bigint講一講應用場景？
• 判斷資料型別的方法？instanceof原理?判斷空物件？ typof null？typeof NaN？
• var/let/const 區別？暫時性死區？塊級作用域？const a = {}; a.x = 1 能不能修改？
• 說說你對函式式編程的理解？函式柯里化的理解？平時的使用場景？
• 防抖、節流的含義，使用場景？手寫一下？
• call、apply、bind區別？bind實作？bind之后還能修改this指向嗎？為什么？
• 閉包概念，最主要的還是問閉包的場景？
• 用es5實作es6類的繼承？各種繼承問的挺多的
• 深拷貝與淺拷貝？常用方法？手寫一個深拷貝函式？
• 說說你知道的JavaScript設計模式？觀察者和發布訂閱的區別？手寫一個發布訂閱？我真的寫了
• 說說對你對JavaScript異步編程的理解？
• ES Module與 CommonJS 模塊的差異？兩者互相加載的方式？一般會扯到AMD
• Promise.all、race、allSettled 概念、手寫？很多手寫題都會用到，比如用promise實作請求并發個數限制？

2、Css

• 水平垂直居中？兼容性？不知道寬高情況下？
• BFC概念？作用？常用場景？
• Flex？注意flex：1的含義，一般會給你個場景題
• 盒模型概念，如何切換盒模型？
• 實作1px邊框？1px線條？
• 偽類和偽元素區別？使用場景？

3、Http && 瀏覽器

• 瀏覽器快取？http快取？ 主要要講一講強快取、協商快取、preload、prefetch、Service Worker等，304的含義？協商快取e-tag是怎么生成的？Last-Modified是基于什么生成的？兩者對比一下？優先級哪個高？
• 什么是跨域？什么情況下會跨域？瀏覽器根據什么欄位判斷是否允許跨域？跨域的解決方案有哪些？options請求了解過嗎？說說CORS中的簡單請求和復雜請求？form表單提交會跨域嗎？
• 講一講瀏覽器事件回圈Event Loop？node 事件回圈描述一下？
• http2有哪些新特性？http2還有哪些缺陷？http3的一些了解？
• 從輸入 URL 到頁面加載完成的程序，一般要很詳細的描述：包括DNS查詢，快取查詢，3次握手，4次揮手，瀏覽器渲染進程等，面試官會從里面再挑幾個問題深入問，比如為什么是3次握手4次揮手？渲染行程中的GUI渲染執行緒、JS引擎執行緒、事件觸發執行緒等等？可能會問到行程執行緒的區別？瀏覽器為什么是多行程？js為什么是單執行緒？怎么支持多執行緒？等等
• https加密原理？主要是講對稱加密和非對此加密結合使用的一個程序，什么是中間人攻擊？和http區別？

4、Vue

• 生命周期？那個生命周期可以獲取到真實DOM？修改data里面的資料，會觸發什么生命周期？
• 組件data為什么是一個函式？
• vue 組件通信？一般說了vuex，就會問vuex用法？action和mutations區別？實作原理等？
• vue 導航守衛，分全域和組件的，一般用于權限控制，這個就可能扯到專案中的一些鑒權問題，
• $nextTick 作用？實作原理？微任務向宏任務的降級處理，經常被問到說出幾種宏任務，微任務，
• vue回應式原理？基本都會問
• vue scoped屬性作用？實作原理？
• vue router有幾種模式？實作方式？
• key的作用？沒有key的情況，vue會怎么做？會引出diff的問題
• vue diff程序，和react diff區別？
• vue 2.x defineProperty缺陷？業務代碼里面怎么處理？$set原理？vue是怎么重寫陣列方法的？考察你是不是真的看過原始碼
• vue 3.0 proxy優缺點？怎么處理vue3不支持IE？
• computed 和 watch 的區別和運用的場景？除了基本的，看你能不能說出三種watcher的區別

5、React

• 生命周期詳細描述一下？官方為什么改變？
• 說說你對虛擬DOM的理解？直接全量更新和diff哪個快（這個問題要分情況）？
• 什么是HOC？React里面用過哪些？可能讓你實作一個add(1)(2)(3)的函式
• Fiber干了什么事情？requestIdleCallback了解多少？
• react性能優化？
• hooks出現的意義？類組件和函陣列件之間的區別是什么？
• 為什么不要在回圈、條件陳述句或者嵌套函式中呼叫hooks？記住官網的一句話，Not Magic, just Arrays
• setState 同步還是異步？比較常問，問的可能也比較深入
• 如何避免組件的重新渲染？memo/useMemo、PureComponent？useMemo和useCallback區別？

6、其他

• 常用的一些模塊，fs/path/http等等
• EventEmitter 概念，使用場景，錯誤捕獲
• Stream 概念？使用場景？常見的Stream？

webpack基本也是必問，得系統學習一下

• webpack 構建流程？打包原理？
• 專案中做的一些優化？
• loader和plugin的區別？有沒有寫過？常用哪些loader和plugin
• webpack熱跟新原理？
• tree-shaking？對于 CommonJS，tree shaking怎么辦？
• webpack loader的執行順序？從左到右？從上到下？

其他

• 專案做過的一些性能優化，基本必問
• 長串列渲染怎么優化？
• 各種懶加載的實作原理？路由？圖片？
• Typescript 中的 interface 和 type 到底有什么區別
• 等等，很多低頻率的想不起了

其他的一些東西，主要還是看你簡歷上寫了什么，或者你的回答有什么面試官感興趣的詞，盡量突出自己的優勢，發揮好就行，結果對自己的檢驗，不是對自己的否定，加油💪🏻

我把我面試遇到過的面試題以及刷到過的面試題做了一個整理，分了HTML、css、JavaScript、React、Vue、瀏覽器、服務端與網路、演算法等等，共229頁PDF，

完整版面試題資料免費分享，只需你點贊支持，動動手指點擊此處就可免費領取了，

最后

不管你是否想要轉行做前端，想做什么就全力以赴去做，不斷學習，分享你的成長，

即使大多數人不看好你的決定，你也要堅持，用結果證明給他們看，