記一次高級(jí)前端開發(fā)工程師面經(jīng)
作者： 唯依綰青絲
https://juejin.cn/post/6951407692011274247
前言
#面試挺累人的，每天下班后趕回家餓著肚子面試，面了將近一個(gè)月，大概就一個(gè)中廠的水平吧。面試完最好進(jìn)行一個(gè)復(fù)盤，查漏補(bǔ)缺。
一、攜程
對(duì)著簡歷問一遍 rem, 計(jì)算出375的屏幕，1rem,單位出現(xiàn)小數(shù)怎么處理 javascript精度問題的原因 axios用途 性能優(yōu)化的點(diǎn)，webpack分包，首頁資源大小，請(qǐng)求優(yōu)化，gzip之前還是之后，React重新渲染 國際化站點(diǎn)，cdn, 在頁面什么階段加載國際化文件，如果有20多個(gè)語言該怎么做 ssr有沒有用過 項(xiàng)目中websocket是解決了什么問題 DOM, BOM, js的關(guān)系 React dom綁定事件，與原生事件有什么區(qū)別 http2多路復(fù)用
代碼題
if (!('a' in window)) {
var a = 1;
}
console.log(a);
var a = {}; var b = {}; var c ={};
console.log(a === b);
console.log(b === c);
console.log(a === c);
var d = e = f = {};
f = {}
e = f
d = e
console.log(d === e);
console.log(d === f);
console.log(e === f);
米哈游：
http狀態(tài) 301，302， 304,緩存相關(guān)字段 cookie、ws是否跨域 觸發(fā)bfc的方式 rem和vw的使用場景 偽代碼實(shí)現(xiàn)下懶加載
某外企:
一、
下面函數(shù)是閉包嗎？
const func = ()=> {
const a = '111'
const fun2 = ()=> console.log(a)
return ()=> console.log('_')
}
const next = func()
'12345'.split('')
上述代碼發(fā)生了什么
下面代碼打印的是
console.log("12345" instanceof Object);
實(shí)現(xiàn)一下some, everyflatten實(shí)現(xiàn)
const promise = new Promise(resolve => {
console.log("11111");
setTimeout(() => {
console.log("22222");
}, 0);
resolve();
console.log("resolve");
throw new Error("error");
console.log("error");
});
promise
.then(
() => {
console.log("33333");
setTimeout(() => {
console.log("44444");
}, 0);
},
() => {
console.log("reject");
}
)
.catch(() => {
console.log("catch");
});
console.log("55555");
函數(shù)組件怎么阻止重復(fù)渲染
二、
AST作用 or babel實(shí)現(xiàn)原理 實(shí)現(xiàn)自定義hooks,usePrevious。setcount(count => count + 1)后輸出上一次count的值
美團(tuán)：
一、
自我介紹中提到了性能優(yōu)化， 說了說性能優(yōu)化的點(diǎn) 不同域名共享cookie on, emit, 實(shí)現(xiàn) 防抖的實(shí)現(xiàn) 輸入url到頁面返回結(jié)果 緩存的實(shí)現(xiàn)方式 React組件重復(fù)渲染 webpack分包
字節(jié)：
一、
Webpack 插件，生命周期 umi約定式路由怎么實(shí)現(xiàn)的 babel實(shí)現(xiàn)遠(yuǎn)原理 React ref fib實(shí)現(xiàn)，如何優(yōu)化
盒馬：
一、
說出你最擅長的部分，追問 webpack拆包的依據(jù)。1.被多個(gè)模塊使用，cache起來 2.資源過大 canvas 點(diǎn)擊線段事件。重合區(qū)域怎么處理 webWorker的使用：為什么不在worker里面發(fā)出請(qǐng)求，做數(shù)據(jù)轉(zhuǎn)換呢？
太美醫(yī)療：
generate函數(shù)和async區(qū)別 webpack插件實(shí)現(xiàn)
叮咚買菜：
一、
Vue， React使用情況 父子組件的mounted 調(diào)用順序 $nextTick實(shí)現(xiàn)原理 子元素水平垂直居中 斐波那契數(shù)列如何優(yōu)化 業(yè)務(wù)題：封裝一個(gè)全局的彈窗，在任何組件內(nèi)都可以調(diào)用。追加：如何同時(shí)打開5個(gè)彈窗，關(guān)閉順序又如何
二、
封裝Vue插件 5個(gè)彈窗 $nextTick原理 手機(jī)號(hào)碼分割 _ _ _ - _ _ _ _ - _ _ _ _ 最大字符串?dāng)?shù)， “abcdabcda” 求最長的不重復(fù)字符串 兄弟組件通信 vuex 模塊化怎么做 不同域名如何共享cookie
總結(jié):
對(duì)于3～5年的前端開發(fā)來說，不應(yīng)該僅僅是停留在會(huì)用API的層面，至少要關(guān)注到你使用的技術(shù)的一些原理實(shí)現(xiàn)。這也是大廠考察候選人鉆研精神吧，相對(duì)來說有一個(gè)區(qū)分度。個(gè)人建議最好精通一個(gè)方向，比如：
前端工程化，webpack, babel, Node 等。 精通框架源碼 可視化，3D方向 流媒體，音視頻
當(dāng)然，如果要進(jìn)大廠的同學(xué)，還得突擊一下算法部分。leetcode 簡單和中等難度就可以。
如果覺得這篇文章還不錯(cuò)，來個(gè)【分享、點(diǎn)贊、在看】三連吧，讓更多的人也看到~
點(diǎn)個(gè)『在看』支持下
評(píng)論
圖片
表情