自我介紹
公司,項目經歷,技術棧,愛好(折騰后端)
CSS
- 清除浮動
overflow:hidden
clearfix
clear :both
- 盒模型
- CSS 中transition和animate有何區(qū)別
- position定位
transition一般用來做過渡的, 沒時間軸的概念, 通過事件觸發(fā)(一次),沒中間狀態(tài)(只有開始和結束)
而animate則是做動效,有時間軸的概念(幀可控),可以重復觸發(fā)和有中間狀態(tài);
JS
- 數(shù)據(jù)類型: null,undefiend,string,number,boolean,symbol和 object
- Promise實現(xiàn)
- ES6+ const,let,箭頭函數(shù),解構,rest操作符,模板字符串,promise,async/await/,class,module系統(tǒng),Array.some/String.padStart/Object.assign/is.
- this和作用域,閉包
- 類型判斷
Object.prototype.toString.call(obj).slice(8, -1); - 原型,構造函數(shù)
- 垃圾回收機制
- 事件輪訓機制, microTask(Promise),macroTask(setTimeout,setInterval)
Vue
- vue響應式原理
vue響應式原理
DOM
DOM操作: 增刪改查
事件冒泡 事件代理
事件冒泡和捕獲
w3c制定了統(tǒng)一的標準——先捕獲再冒泡。
element.addEventListener(event, function, useCapture)
第一個參數(shù)是需要綁定的事件
第二個參數(shù)是觸發(fā)事件后要執(zhí)行的函數(shù)
第三個參數(shù)默認值是false，表示在事件冒泡階段調用事件處理函數(shù);如果參數(shù)為true，則表示在事件捕獲階段調用處理函數(shù)。
瀏覽器
- 從地址欄輸入url到頁面加載經歷了什么
- IP尋址，dns解析(瀏覽器-系統(tǒng)-路由器-dns服務器)
- TCP三次握手，四次揮手，HTTP協(xié)議發(fā)送請求報文，解析響應報文
- 請求html,下載css/js。繪制頁面，js解釋執(zhí)行
- 用戶看到頁面
- http協(xié)議
- 頁面性能優(yōu)化
- 體積 js/css/img壓縮，chunk分割，減少第三方庫依賴，gzip壓縮
- 減少請求 css精靈圖 緩存(e-tag/if-modified) service worker緩存
- 代碼方面 內存泄露(閉包/全局變量) tree-shaking 減少重排重繪
- 預加載 link preload
- 服務器端渲染
- http2多路復用 頭部壓縮
- 重繪和重排
- css3動畫優(yōu)化
- localstorage,sessionstorage和cookie
大小，API友好，生命周期
Nodejs
- 異步IO,事件循環(huán),
- 模塊循環(huán)以來
假設a,b模塊循環(huán)依賴，那么a加載后執(zhí)行到某段進入b模塊,b模塊又反過來引用a模塊,那么b則只會獲取到a模塊已執(zhí)行的代碼（unfinished part），而不會獲取到a未執(zhí)行的部分。因為commonjs是同步加載的。b執(zhí)行結束后才會執(zhí)行a余下的部分。
類似function a執(zhí)行過程中進入function b。類似棧的概念。
前端工程化
- webpack性能優(yōu)化
dll,多進程編譯，commonchunk,設置別名，loader的exclude
HTTP協(xié)議
- https
- http頭
- 跨域 jsonp cors 代理
- TCP,IP分層和職責
- http狀態(tài)碼
1XX 正在處理 其中101 switching protocols經常用于Websocket建立時的Http協(xié)議轉Websocket協(xié)議 具體流程為發(fā)送get請求，通過Upgrade: Websocket頭升級為Websocket，通道建立成功后就采用Websocket協(xié)議通信
2XX 請求成功 204 常用于options預檢請求，因為沒有報文主體傳輸效率更高
3XX 重定向 304 Not Modified常用于緩存
4XX 客戶端錯誤 參數(shù)錯誤...
5XX 服務端錯誤
