博主就讀于電子科技大學(xué)拭卿，大三狗一枚骡湖！面試是個(gè)漫長的過程，從海投到收獲電話面試峻厚，一面响蕴、二面、三面目木，一個(gè)步驟出錯(cuò)那么后面就宣告終結(jié)换途。同時(shí)，面試過程中你也可能會(huì)遇到一些面試官的刁難刽射，甚至部分面試官會(huì)說些比較打擊你的話军拟，但是大部分面試官都是很棒的！
為什么要寫這篇文章
從一開始手指冒汗被懟的說不出話誓禁，到最后和面試官侃侃而談?dòng)稳杏杏嘈赶ⅲ野l(fā)現(xiàn)：同樣的能力水平，在不同的面試表現(xiàn)下摹恰，反饋到面試官眼中的結(jié)果可以有著天壤之別辫继。
因此，如果你希望把自己的真實(shí)水平展示給面試官俗慈，那么掌握一些合適的方法是非常有必要的姑宽。
面經(jīng)分享
第一部分是我前端面試的經(jīng)驗(yàn)總結(jié)，第二部分是我認(rèn)為比較有思考空間的題目
? 經(jīng)驗(yàn)總結(jié)
- 一份漂亮的簡歷闺阱，需要包括以下部分（排版由上而下）
- 個(gè)人亮點(diǎn)（專精領(lǐng)域炮车，個(gè)人博客，開源項(xiàng)目）
- 教育經(jīng)歷（畢業(yè)院校，在校經(jīng)歷瘦穆、榮譽(yù)）
- 工作經(jīng)歷（實(shí)習(xí)）
- 項(xiàng)目經(jīng)歷
- 專業(yè)技能
- 扎實(shí)的前端基礎(chǔ)纪隙，比如你知道
-
<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'/>作用是什么？ - flex:1 的 1 代表什么扛或？
- 閉包, 作用域, 內(nèi)存绵咱？
-
- 熟悉一門前端框架（Vue 優(yōu)先）
- 勤刷《前端初級(jí)工程師面試題精編》 的算法題，熟悉掌握相應(yīng)的數(shù)據(jù)結(jié)構(gòu)如常見的鏈表熙兔、棧悲伶、隊(duì)列、哈希表黔姜、樹
- 熟悉網(wǎng)絡(luò)基礎(chǔ)拢切、Git 命令、Linux 命令秆吵、打包工具
- 多去了解前端的新趨勢(shì)（Flutter，PWA五慈，Serveless纳寂，GraphQL，CSS Houdini）
- 要有自信泻拦，讓面試官感受到你對(duì)前端的熱愛
此文純個(gè)人觀點(diǎn)毙芜，希望讀者保持自己的判斷。
題外話：看完你會(huì)忍不住點(diǎn)個(gè)贊的争拐，點(diǎn)贊再看腋粥，養(yǎng)成習(xí)慣 ??
? 推薦閱讀：
2021前端面試題精選
老生常談的面試題就不放出來了隘冲，大廠常規(guī)面試流程也不寫了（不利于閱讀，有興趣的可以翻翻博主文章）
HTML绑雄、CSS相關(guān)
- 網(wǎng)絡(luò)中使用最多的圖片格式有哪些
- 請(qǐng)簡述css盒子模型
- 視頻/音頻標(biāo)簽的使用
- HTML5新增的內(nèi)容有哪些
- HTML5 新增的語義化標(biāo)簽有哪些
- CSS3新增的特性
- 清除浮動(dòng)的方式有哪些展辞？請(qǐng)說出各自的優(yōu)點(diǎn)
- 定位的屬性值有何區(qū)別
- 子元素如何在父元素中居中
- Border-box與content-box的區(qū)別
- 元素垂直居中
- 如何讓chrome瀏覽器顯示小于12px的文字
- CSS選擇器有哪些，那些屬性可以繼承万牺，優(yōu)先級(jí)如何計(jì)算罗珍？
- CSS3新增的偽類有哪些？
- 網(wǎng)頁中有大量圖片加載很慢 你有什么辦法進(jìn)行優(yōu)化脚粟？
- 行內(nèi)元素/塊級(jí)元素有哪些覆旱？
- 瀏覽器的標(biāo)準(zhǔn)模式和怪異模式區(qū)別？
- Margin和padding在什么場(chǎng)合下使用
- 彈性盒子布局屬性有那些請(qǐng)簡述?
- 怎么實(shí)現(xiàn)標(biāo)簽的禁用
- Flex布局原理
- px核无，rem扣唱，em的區(qū)別
- 網(wǎng)頁的三層結(jié)構(gòu)有哪些
- 請(qǐng)簡述媒體查詢
- 三欄布局方式兩邊固定中間自適應(yīng)
- Doctype作用
- CSS 預(yù)處理 sass less 是什么？為什么使用他們
- 怎么轉(zhuǎn)換less為css
- Js基本數(shù)據(jù)類型有哪些
- Ajax如何使用
- 如何判斷一個(gè)數(shù)據(jù)是NaN
- 閉包是什么？有什么特性画舌？對(duì)頁面會(huì)有什么影響
- Js中常見的內(nèi)存泄漏：
- 事件委托是什么堕担？如何確定事件源（Event.target 誰調(diào)用誰就是事件源）
- 什么是事件冒泡？
- 本地存儲(chǔ)與cookie的區(qū)別
- ES6新特性
- Let與var與const的區(qū)別
- 數(shù)組方法有哪些請(qǐng)簡述
- 請(qǐng)掌握2種以上數(shù)組去重的方式
- 什么是面向?qū)ο笳?qǐng)簡述
- 普通函數(shù)和構(gòu)造函數(shù)的區(qū)別
- 請(qǐng)簡述原型 / 原型鏈 /（原型）繼承
- Promise的理解
- 請(qǐng)簡述async的用法
- 一個(gè)頁面從輸入 URL 到頁面加載顯示完成曲聂，這個(gè)過程中都發(fā)生了什么霹购？
- Js中.call()與.apply()區(qū)別
- 為什么會(huì)造成跨域/請(qǐng)簡述同源策略
- This指向
- 什么是jsonp工作原理是什么？他為什么不是真正的ajax
- 請(qǐng)寫出一個(gè)簡單的類與繼承
- 同步與異步的區(qū)別/阻塞與非阻塞區(qū)別
- 為什么js是弱類型語言
- 箭頭函數(shù)與普通函數(shù)的區(qū)別
- For循環(huán)與map循環(huán)有什么區(qū)別
- 原型和繼承朋腋，prototype齐疙，call和apply繼承的區(qū)別
- 深淺拷貝是什么如何實(shí)現(xiàn)？
- 什么時(shí)候用深拷貝 /淺拷貝
- 什么是js內(nèi)存泄露旭咽？
- 什么是csrf攻擊
- 預(yù)加載和懶加載的區(qū)別贞奋，預(yù)加載在什么時(shí)間加載合適
- Js的函數(shù)節(jié)流和函數(shù)防抖的區(qū)別
- 什么是jQuery？
- 為什么要使用jQuery穷绵？jquery有哪些好處轿塔？
- Jquery選擇器有哪些
- Jquery插入節(jié)點(diǎn)的方法
- jQuery對(duì)象和DOM對(duì)象是怎樣轉(zhuǎn)換的
- jQuery中.get()提交和.post()提交的區(qū)別
- 怎么使用jQuery中的動(dòng)畫
- jQuery中如何來獲取和設(shè)置屬性
- 如何來設(shè)置和獲取HTML和文本的值？
- jQuery中有哪些方法可以遍歷節(jié)點(diǎn)仲墨？
- $(this) 和 this 關(guān)鍵字在 jQuery 中有何不同勾缭？
- jQuery 里的 each() 是什么函數(shù)？你是如何使用它的目养？
- Query中的Delegate()函數(shù)有什么作用俩由？
- http是什么癌蚁？有什么特點(diǎn)
- HTTP協(xié)議和HTTPS區(qū)別
- 請(qǐng)簡述ajax的執(zhí)行過程 以及常見的HTTP狀態(tài)碼
- Get和post不同
- 請(qǐng)輸出三種減少頁面加載時(shí)間的方式
- 重繪和回流是什么
- 你如何對(duì)網(wǎng)站的文件和資源進(jìn)行優(yōu)化幻梯？
Vue相關(guān)
- Vue的核心是什么
- 請(qǐng)簡述你對(duì)vue的理解
- 請(qǐng)簡述vue的單向數(shù)據(jù)流
- Vue常用的修飾符有哪些
- v-text與{{}}與v-html區(qū)別
- v-on可以綁定多個(gè)方法嗎
- Vue循環(huán)的key作用
- 什么是計(jì)算屬性
- Vue單頁面的優(yōu)缺點(diǎn)
- Vuex是什么？怎么使用努释？在那種場(chǎng)景下使用
- Vue中路由跳轉(zhuǎn)方式（聲明式/編程式）
- 路由中name屬性有什么作用碘梢？
- vue跨域的解決方式
- Vue的生命周期請(qǐng)簡述
- Vue生命周期的作用
- DOM渲染在那個(gè)生命周期階段內(nèi)完成
- Vue路由的實(shí)現(xiàn)
- Vue路由模式hash和history，簡單講一下
- Vue路由傳參的兩種方式洽洁，params和query方式與區(qū)別
- Vue數(shù)據(jù)綁定的幾種方式
- Vue注冊(cè)一個(gè)全局組件
- Vue的路由鉤子函數(shù)/路由守衛(wèi)有哪些
- Vue中如何進(jìn)行動(dòng)態(tài)路由設(shè)置痘系？有哪些方式？怎么獲取傳遞過來的數(shù)據(jù)饿自？
- Elementui中的常用組件有哪些汰翠？請(qǐng)簡述你經(jīng)常使用的 并且他們的屬性有哪些？
- Vue中指令有哪些
- Vue如何定義一個(gè)過濾器
- 對(duì)vue 中keep-alive的理解
- 如何讓組件中的css在當(dāng)前組件生效
- Vue生命周期一共幾個(gè)階段
- Mvvm與mvc的區(qū)別
- Vue組件中的data為什么是函數(shù)
- Vue雙向綁定的原理
- Vue中組件怎么傳值
- Bootstrap的原理
- Watch請(qǐng)簡述
- Vant Ui請(qǐng)簡述下
- 計(jì)算屬性與watch區(qū)別
- mvvm框架是什么昭雌？它和其它框架（jquery）的區(qū)別是什么复唤？哪些場(chǎng)景適合？
- Vue首屏加載慢的原因烛卧，怎么解決的佛纫，怎么解決白屏問題
- Vue雙數(shù)據(jù)綁定過程中妓局，這邊兒數(shù)據(jù)改變了怎么通知另一邊改變
- Vuex流程
- Vuex怎么請(qǐng)求異步數(shù)據(jù)
- Vuex中action如何提交給mutation的
- Route與router區(qū)別
- vuex的State特性是？
- vuex的Getter特性是呈宇？
- vuex的Mutation特性是好爬？
- vuex的actions特性是？
- vuex的優(yōu)勢(shì)
- v-for與v-if優(yōu)先級(jí)
React相關(guān)
- fetch VS ajax VS axios
- React事件處理—修改this指向
- 請(qǐng)簡述你對(duì)react的理解
- react組件之間的數(shù)據(jù)傳遞
- Vue與react區(qū)別
- 請(qǐng)簡述虛擬dom與diff算法
- 調(diào)用 setState 之后發(fā)生了什么甥啄？
- react 生命周期函數(shù)
- 為什么虛擬 dom 會(huì)提高性能?(必考)
- State與props區(qū)別
- shouldComponentUpdate 是做什么的
- react diff 原理
- 何為受控組件
- 調(diào)用 super(props) 的目的是什么
- React 中構(gòu)建組件的方式
小程序相關(guān)的
- 小程序的優(yōu)勢(shì)
- 小程序的頁面構(gòu)成
- 小程序的生命周期
- 小程序如何請(qǐng)求數(shù)據(jù)
- 如何提高小程序的首屏加載時(shí)間
- 請(qǐng)簡述你經(jīng)常使用的小程序的組件
- wxss與css的區(qū)別請(qǐng)簡述
- 怎么優(yōu)化小程序
- 小程序如何顯示用戶頭像與用戶名
- 請(qǐng)談?wù)勑〕绦虻碾p向綁定和vue的異同存炮？
后話
對(duì)于面試蜈漓，說幾句個(gè)人觀點(diǎn)穆桂。
面試，說到底是一種考試融虽。正如我們一直批判應(yīng)試教育脫離教育的本質(zhì)享完，為了面試學(xué)習(xí)技術(shù)也脫離了技術(shù)的初心。但考試對(duì)于人才選拔的有效性是毋庸置疑的有额，幾千年來一直如此般又。除非你有實(shí)力向公司證明你足夠優(yōu)秀，否則巍佑，還是得乖乖準(zhǔn)備面試倒源。這也并不妨礙你在通過面試之后按自己的方式學(xué)習(xí)。
其實(shí)在面試準(zhǔn)備階段句狼，個(gè)人的收獲是很大的，我也認(rèn)為這是一種不錯(cuò)的學(xué)習(xí)方式热某。首先腻菇，面試問題大部分基礎(chǔ)而且深入，這些是平時(shí)工作的基礎(chǔ)昔馋。就好像我們之前一直不明白學(xué)習(xí)語文的意義筹吐，但它的意義就在每天的談話間。
所謂面試造火箭秘遏，工作擰螺絲丘薛。面試往往有更高的要求，也迫使我們更專心更深入地去學(xué)習(xí)一些知識(shí)邦危，也何嘗不是一種好事洋侨。
