前情提要（分享個人情況，可以直接跳過）
先說一下我的個人情況，我是2026屆的，目前是在找前端實習。 3月初，從3月3日開始在Boss上投簡歷。
分享我的個人故事，不想看可以直接滑到下面，
接下來講述以周為單位
第一周
在周四和周五分別約到了一場面試。
周四面試官問我都是關于vue2的八股文，然后我沒怎么看，回答的很糟糕，10分鐘左右就結束了，他最后問我有沒有什么問題，我當時非常down，感覺世界都灰暗了，什么都沒有問。沒想到他下午竟然又約了二面，問的全是關于項目的，項目沒什么亮點，我認為回答的也一般。
周五這次面試既有八股文也有項目，八股文比較簡單，就是html，css，JavaScript之類的，很基礎，后來關于項目就問了我一點，你做項目讓你印象最深的，我就很簡單說了一點，后來就沒繼續問項目了。
第一周真的很狼狽，我發現自己八股文，項目都很糟糕，兩天時間，我針對自己的問題，做了初步的改正。
第二周
我還有一個最大的問題就是和別人交流總是有點緊張，然后這周我就積極約面試，每天把BOSS上面的打招呼次數都用完，
周二-周五每天都有一場面試，接下來就是在面試中發現問題，解決問題。 這一周就是動力滿滿，一面試就暴露問題，面試完我就復盤總結，自己哪方面需要改變，一直都是發現問題，解決問題，過得比較充實。
這一周面完，感覺自己經驗已經積累夠了，我就打算下周投一些中廠之類的，因為我其實不太甘心自己在一個小廠的，所以就打算繼續投。
第三周
這一周就是投的比較佛系，而且投的都是中大廠，也在一些官網投。因為學校不讓實習的原因，我個人也沒什么動力了，感覺有offer也走不了，就比較又懈怠了，這周沒怎么學，因為個人是任務驅動型的，就是有什么需要解決，我才會行動，否則就比較擺爛。
現在一周已經過去了，回復我的人寥寥無幾，基本沒什么水花，只有在周四有一場面試，然后這個面試就結合項目來提問一些八股文，就回答的一般。他還問了我一個八股文，讓我做一道題（現在想我真是太老實了，當時應該直接上網搜！！！！！）
服了，CSDN新開發的一個編輯模式真不太好用，剛一個撤銷，把我的一部分記錄給弄丟了，重寫！！！！
回歸正題，說一些我遇到的問題
http和請求方面的
1.http的狀態碼
回答2xx-5xx的，他額外了提問3xx方面的
2xx - 成功狀態碼 200 3xx - 重定向狀態碼。301，資源永久移動到新位置 302 臨時移動到新位置 304資源未修改，可以使用緩存
4xx - 客戶端錯誤狀態碼 403服務器拒絕請求，客戶端沒有訪問權限。 404 請求資源不存在 5xx - 服務器錯誤狀態碼 500服務器內部錯誤，無法完成請求。503 服務器暫時不可用（通常由于過載或維護）
2.get和post區別，get是否可以提交數據，post是否可以請求數據。post是否可以在路徑后面拼接變量。
答案是都可以。
GET：1. 用于從服務器獲取資源。例如加載網頁、查詢信息等。2. 數據附加在 URL 后面，長度限制。3.可以進行提交數據，但是數據會暴露在URL里面，不安全，而且有長度限制。4.默認緩存
POST：1.用于向服務器提交數據。通常用于提交表單、上傳文件、修改數據等。2.數據通過請求體（Request Body）傳遞，不會顯示在 URL 中，沒有長度限制。3.post可以獲取數據。4.不會默認緩存。
3.如果一個頁面中多個請求，如何區分這些請求
使用promise.all
4.一個頁面中請求A和請求B完成之后，在發生請求C，如何實現？他說讓自己實現，不用已經給的一些語法之類的。
Promise.all?把A,B完成之后去執行C 2.async/await?讓A,B先執行，然后執行C，await會暫停當前代碼，只有前面執行完才執行后面 3.通過一個計數器來記錄請求A和請求B的完成狀態，當兩個請求都完成后，再發起請求C。
5.瀏覽器本地存儲方式，區別
localStorage，sessionStorage，cookie，indexedDB（這個當時沒有答出來，面試官補充了）
6.你怎么解決跨域，什么是跨域，proxy可以實現跨域原理
協議域名和端口只要有一個不一樣就是跨域， 瀏覽器會檢測到跨域，而不是服務器。 如何解決：1. jsonp script的src屬性向后端發送請求，后端把數據放到callback回調函數中返回。
2.cors跨域資源共享，后端配置目標服務器，設置響應頭 access-control-allow-origin設置為允許跨域的源。
3. proxy代理，在vue里面webpack.config.js的devserve屬性，設置路徑，以什么開頭匹配規則。設置目標服務器地址，和是否開啟代理，和重寫路徑。這里原理就是：服務器代替瀏覽器去請求目標接口，從而繞過瀏覽器的同源策略。
7.你是否封裝過axios，說一下
css
1.說一下盒子模型
普通盒子模型和怪異盒子模型
2.解釋一下BFC。
bfc塊級格式上下文是css一個渲染機制，有一套獨屬于自己的渲染規則（bfc區域不會與浮動相重疊），所以他會形成一個相對外界完全獨立的空間，讓內部的子元素不會影響外部的元素。
觸發他的條件：根元素（html），浮動元素，display:inline-block/flex，overflow:hidden/atuo/scroll，position:absolute/fixed。
場景：
1.防止margin重疊（設置一個元素為bfc）
2.清除內部浮動，防止父元素高度塌陷（元素設置浮動，他會脫離正常的文檔流，導致父元素無法正確計算高度，通過給父元素設置bfc，讓他可以包含內部浮動的元素。
3.自適應多欄布局（因為bfc區域不會和浮動元素重疊，左右兩個元素，一個元素設置浮動，給他固定大小，bfc元素高度固定，寬度自適應）
3.定位有哪幾種
static/absolute/relative/fixed
然后面試官又繼續提問relative和absolute區別。
Relative元素相對于其正常位置進行偏移，使用?top、bottom、left、right?調整位置，不影響其他元素布局。
Absolute元素相對于最近的已定位祖先元素（非?static）進行定位，若無則相對于?<html>。脫離文檔流，不影響其他元素。
4.響應式布局如何實現？
讓網站能夠根據不同設備的屏幕尺寸（比如PC，平板和手機）來自動調整布局和設計。
場景：
1.媒體查詢（根據媒體查詢，為不同的屏幕尺寸設置不同的樣式）@media screen and (min-width:1000px){}@media screen (min-width:500px) and (max-width:1000px){}
2.使用相對單位（百分比，em，rem）定義布局的寬高，從而讓頁面可以根據屏幕尺寸自動調整，實現自適應。
3.flex布局 注意為了適應移動端meta設置viewport 優點：可以兼容不同設備。缺點：兼容設備工作量大，效率低。
這里回答給自己埋了一個雷點，面試官又繼續問rem，我其實知道，但當時搞混淆rem和em了。 em（相對于當前自己的大小，如果沒有就是父元素字體大小），rem（相當于根元素html字體大小）
5..元素水平垂直居中的方法
flex /positon+transform/position+margin
6.說一下重繪和重排的區別
重繪：當元素的外觀發生變化（如顏色、背景、邊框等），但不影響布局時，瀏覽器會重新繪制元素。
重排：當元素的幾何屬性發生變化（如尺寸、位置、布局等），瀏覽器需要重新計算元素的布局，并重新構建渲染樹。
js
1.說一下事件循環，接下來又給我了一道題（這里其實考到了異步任務的宏任務和微任務）
同步任務在主線程進行，放入棧中。異步任務不進入主線程，進入隊列。同步任務順序執行，只有執行棧中的同步任務都執行完成了，系統才會把任務隊列的異步任務，放入執行棧中執行，如此循環，直到所有任務執行完畢。
console.log('A');
setTimeout(() => console.log('B'), 0);
Promise.resolve().then(() => console.log('C'));
console.log('D');A-D-C-B
2.說一下原型鏈，接下來給我一道題（這里主要靠考我的就是Object.setPrototypeOf這個方法，他改變了原型）
function Person(name) {this.name = name;
}Person.prototype.sayName = function () {console.log(this.name);
};Person.prototype.type = "human"; const p1 = new Person("Alice");
const p2 = new Person("Bob");Object.setPrototypeOf(p1, { sayName() { console.log("Changed!"); } });p1.sayName(); // 輸出?changed
p2.sayName(); // ?bobconsole.log(p1.type); // ?undefinded
console.log(p2.type); // ?humanconsole.log(p1.__proto__ === Person.prototype); // ?false
console.log(p2.__proto__ === Person.prototype); // ?true
3.解釋一下閉包。說一下閉包的場景
閉包是指一個內部函數引用的外部變量。具體來說就是函數的嵌套，一個函數里面嵌套了另一個函數，內部函數調用外部函數的變量，內部函數在外部函數外面調用。
作用：創建私有變量，防止變量被污染。回調函數。函數柯里化。
缺點：內存泄露，保留對外部變量的引用，可能會導致內存無法釋放，這樣還會占用更多內存。
4.你在項目中常用到的數組方法
增刪改查：push unshift pop shift splice指定位置添加或刪除 splice(1,2)在1的位置刪除兩個 修改 concat slice join 查找：indexOf includes 遍歷 forEach map filter reduce find
5.你在項目中常用到的字符串方法
查找：indexof includes 修改：concat slice split replace
ES6
1.let，const，var區別
2.說一下promise
3.箭頭函數和普通函數區別
4.了解map嗎，說一下map
vue2
1.v-if和v-show的區別
v-if本質通過添加和刪除dom節點，v-show本質通過display:none控制隱藏
2.組件間通信的方式
父子通信。1.props，父親給兒子傳遞數據，子通過props接收。 2.自定義事件$emit。子$emit觸發自定義事件，事件名和參數，父親通過綁定監聽器獲取子傳遞的數據。3.ref。父親在使用子組件時候給子組件綁定ref，通過ref獲取數據this.$ref.
兄弟通信，通過創建一個全局事件總線eventbus。一個組件通過$emit觸發自定義事件傳遞參數，另一個組件通過$on監聽自定義事件。
祖孫。祖先通過provide傳遞值，孫子通過inject接受值。
vuex可以實現任意組件間通信
3.生命周期，created和mounted區別
beforecreated/created/beforemounted/mounted/beforeupdate/updated/beforedestroy/destoryed
created時候，vue實例創建完成，data，method，computed初始化完成，但DOM未生成 mounted，組件模板渲染未真實的DOM
4.父組件里面有一個子組件，他們如何加載生命周期鉤子
父親beforecreate/created/beforemount/—>子beforecreate/created/beforemount/mounted/—>父親mounted
5.routes和router區別
routes （路由）是路由的靜態配置，定義了 URL 路徑與組件的映射關系。路由對象包含：path、component，children。
router （路由器）是 Vue Router的實例，用于管理路由的跳轉、監聽 URL 變化以及渲染對應的組件。它通過?new VueRouter()?創建，并接收?routes?作為配置。
6.如果父組件接受子組件傳遞過來的值是否可以修改，原理
不可以，數據單向流動。
7.如果給vue2的對象新增一個屬性，是否能監聽到，怎么讓他可以監聽到
不可以，vue.set
8.如果我發現了indexof這個方法在控制臺報錯怎么辦？
我說可以把這個方法替換成其他的，但是他說工作量大，
通過在Object的原型鏈上補充一個indexof這個方法，要不然就使用webpack。
9.vue3有哪些新特性
1.compostion api
2.更小的體積，支持tree-shaking
3.響應式系統重構，proxy代替了vue2的Object.dinfineproperty，遞歸遍歷對象的屬性，開銷大，無法監聽新增或刪除的屬性（vue.set.vue.delelte）proxy監聽整個對象，不需要遞歸 遍歷
4.虛擬dom的優化，渲染速度更快
5.多根節點。
屬于給自己埋雷了，面試官又問怎么重寫了虛擬dom
vue2 基于 Snabbdom 庫，每次渲染都會對比靜態節點。vue3 不依賴第三方庫，優化后diff算法，支持patch flag，通過在編譯階段標記動態節點，只對比這些標記的節點，避免重復對比。
10.vue3中ref和reactive區別
ref適用于基本數據類型，比如string，number，通過value訪問。 內部通過reactive實現響應式。對于基本數據類型，會把他包裝成一個對象， 通過value訪問。 解構后仍然保持響應式
reactive適用于對象或者數組，直接訪問和修改屬性。 內部通過proxy實現響應式，直接監聽對象的變化。 直接訪問對象的屬性 解構后不是響應式。’如果需要解構對象，可以使用?toRefs?保持響應性（包裹結構的對象）
11.vue3中的reactive整個替換會失去響應式，怎么辦
可以通過逐個替換屬性。推薦使用?Object.assign 可以通過reactive包裹新對象，這個替換就可以 對于頻繁需要替換的對象，通過ref包裹這個對象，然后替換不會失去響應式。
12.說一下vuex常用的一些屬性，mutions和actons的區別
13.你是否封裝過組件，說一下
其他：
1.開始基本上都是讓做個自我介紹（可以好好想一個，然后固定話術）
2.面試完之后，面試官都會問，你有什么想要問（我一般這個時候會問公司的一些情況，比如前端多少人，準備招多少人，公司具體開發方向之類的，剛開始我會問他我表現怎么樣，有什么問題，但很多面試官感覺是出于禮貌，基本都會說，你表現的很好，沒什么問題，也有面試官說了幾個問題。幾場面試下來，我感覺讓他們給我提建議還是比較困難的，后來我就不怎么問這個了。）
3.基本都會問你在項目中有什么難度，項目中什么讓你印象比較深的（可以提前想好自己項目的點，自己怎么解決的，還是固定一套話術）
4.面試官基本都是比較友好的，你回答問題不會也沒什么大不了，他們不會打也不會罵你，語氣一直比較溫和，反而最后還會回答你的一些問題，所以說不要害怕面試。
暫時先到這里，后續有問題再補充
)
