摘要:動畫相關參考案例可能會變,主要考察動畫相關的知識點瀏覽器內核相關瀏覽器瀏覽器內核差異渲染機制不同參考搜索引擎找了一波,分享內容不多,特別是針對差異的文章。。。
動畫相關
//html//css .btn { width: 100px; height: 20px; background: coral; border: 1px solid #5e6d82; } .change { width: 0; height: 20px; background: #2D93CA; transition: all 2s; } .btn:hover .change { width: 100px; }
參考:https://codepen.io/JulianLava...
案例可能會變,主要考察 transition / animation 動畫相關的知識點
瀏覽器內核相關trident / IE瀏覽器
gecko / firefox瀏覽器
webkit 內核 / safari & Chorome
差異:渲染機制不同
參考:https://juejin.im/entry/5a05a...
搜索引擎找了一波,分享內容不多,特別是針對差異的文章。。。
JS語言特性1、 解釋型語言 - 不需要編譯,直接解釋運行
2、弱類型 - 對變量沒有嚴格數據類型要求
3、跨平臺 - 只要有js解釋器 支持,能在任何地方運行
4、 基于對象 - 不僅能創建對象,也能基于對象創建對象 (原型鏈)
http 協議 / 緩存機制強緩存 / 優先級最高,如果存在且未過期則直接返回緩存內容
Expires / http1.0 缺陷:受限于本地時間,如果修改本地時間則會失效
Cache-Control / http1.1 作為對1.0的一個補強
協商緩存 / 緩存過期則會進行協商緩存
Last-Modified 和 If-Modified-Since / http1.0
Last-Modified 表示本地文件最后修改日期,If-Modified-Since 會將 Last-Modified 的值發送給服務器,詢問服務器在該日期后資源是否有更新,有更新的話就會將新的資源發送回來。
但是如果在本地打開緩存文件,就會造成 Last-Modified 被修改,所以在 HTTP / 1.1 出現了 ETag
ETag 和 If-None-Match / http1.1
ETag 類似于文件指紋,If-None-Match 會將當前 ETag 發送給服務器,詢問該資源 ETag 是否變動,有變動的話就將新的資源發送回來
參考: https://mp.weixin.qq.com/s/y-...
虛擬dom 算法參閱: https://segmentfault.com/a/11...
瀏覽器渲染機制渲染機制主要和瀏覽器內核有關,不同瀏覽器渲染流程不同
參考:https://juejin.im/entry/59e1d...
什么是骨架屏參考:https://segmentfault.com/a/11...
lazyload 實現原理核心概念: 滾動監聽 / 元素位置 / 可視區域
深入學習:看 GitHub 懶加載的庫源碼 -lazy load
箭頭函數和 普通函數的區別由于this在詞法層面完成綁定,this指針無法被修改
沒有原型對象 var foo = () => {}; console.log(foo.prototype) //undefined
無法使用new操作符 var Foo = () => {}; var foo = new Foo(); //Foo is not a constructor
箭頭函數不綁定arguments,取而代之用rest參數…解決 function foo(...args) { return args; } foo(1, 2, 3); // [1,2,3]js遍歷對象
1、 for in 循環 / 循環遍歷自身的和繼承的可枚舉屬性
2、Object.keys(obj) / 返回一個數組,包括對象自身的(不含繼承)所有可枚舉屬性
3、getOwnPropertyNames() / 用于返回對象所有屬性,包含可枚舉屬性和不可枚舉屬性,不包含Symbol屬性
4、 Object.getOwnPropertySymbols() / 用于返回對象所有屬性,包含可枚舉屬性和不可枚舉屬性,只包含Symbol屬性
computed 相關1、計算屬性擁有緩存優勢 / 緩存內部實現原理
2、默認只有getter,可以手動設置setter,沒有設置情況下賦值會報錯
CORS 相關簡單請求:
1、使用 get 、 head 、 post
2、content-type 必須為text/plain、multipart/form-data、application/x-www-form-urlencoded之一
3、沒有人為設置規范外header字段
不滿足以上要求均為復雜請求,發送請求之前會先進行預檢請求
cors 攜帶 cookie 相關
cors中請求默認不攜帶cookie,除非滿足以下條件:
1、請求配置了 withCredentials = true;
2、后端配置了 Access-Control-Allow-Credentials: true
3、Access-Control-Allow-Origin 設置不為 *
參考:https://developer.mozilla.org...
后記難度偏中,前端技術扎實,想拿到offer應該不難
如果覺得本文對你有所幫助,就star一下吧~大傳送之術! 我的博客Github
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/54930.html
摘要:動畫相關參考案例可能會變,主要考察動畫相關的知識點瀏覽器內核相關瀏覽器瀏覽器內核差異渲染機制不同參考搜索引擎找了一波,分享內容不多,特別是針對差異的文章。。。 動畫相關 //html //css .btn { width: 100px; height: 20px; background: coral; border: 1...
摘要:動畫相關參考案例可能會變,主要考察動畫相關的知識點瀏覽器內核相關瀏覽器瀏覽器內核差異渲染機制不同參考搜索引擎找了一波,分享內容不多,特別是針對差異的文章。。。 動畫相關 //html //css .btn { width: 100px; height: 20px; background: coral; border: 1...
摘要:和的區別,本想問下要不要深入的講下源碼級別,結果面試官說不用了。來分鐘不到,就再次打電話過來約了明早上午點的視頻面試。 出去面試的話還是得好好準備,不然會被虐的有點慘! 有贊(框架組) 四月份面試有贊的時候,自己還在實習,所以也沒有復習,是在 Boss 直聘上投的,當時看到了有贊的 2018 屆春招,就投了下,然后不知道怎么就被推到了框架組,結果后面就感覺自己被虐的可慘了。 關注我 s...
摘要:新一代的選擇,每個人選擇不同,人生道路歷程也不同。尤其是與人溝通還有更多點擊續集泥瓦匠想做一個與眾不同的技術匠 本文閱讀大約 3 分鐘。謝謝你讀到這篇文章 喝了最后一口百事可樂,想到它的 slogan:新一代的選擇。新一代的選擇,每個人選擇不同,人生道路歷程也不同。就像我剛畢業的時候,畢業選擇不一樣,現在就不一樣了 沒畢業前,報名醫科大讀書,但因為色弱被調劑到信管專業。這就是被選擇了,...
閱讀 788·2021-10-09 09:44
閱讀 692·2019-08-30 13:55
閱讀 3153·2019-08-29 15:07
閱讀 3218·2019-08-29 13:09
閱讀 2413·2019-08-29 11:10
閱讀 1289·2019-08-26 14:05
閱讀 3591·2019-08-26 13:57
閱讀 2206·2019-08-23 16:42