回流
當 Render Tree 中的一部分節(jié)點因為元素的尺寸大小、布局、隱藏/顯示的切換等改變時,需要對 DOM Tree 進行重新的構建的,這就是回流。
重繪
當 Render Tree 中的一些元素需要更新部分屬性,并且這些屬性只是影響元素的外觀顯示,不影響布局的時候,就是重繪。
如果有想學習編程的初學者,可來我們的前端直播授課群的哦:733395506里面免費送整套系統(tǒng)的前端教程
為什么要用 Sass/Less/Stylus ?
這些 CSS 預處理語言可以讓 CSS 具有一定的編程風格,在我實際的開發(fā)體驗中給我?guī)砹嗽S多便捷的地方,并且使用他們更有利于項目的后期維護。
可以定義變量,這對于設置很多重復性顏色來說真的太方便了
可以嵌套式的書寫(仁者見仁智者見智吧),我更喜歡 Stylus 的書寫方式
提高了樣式的復用性,避免重復書寫許多公共樣式
可以定義一些函數,這在移動端開發(fā)方面可以做媒體查詢、適配等工作
HTML5/CSS3 新特性
簡單回答了幾個,不是太全面
HTML5
更多的語義化標簽(header/nav/footer/section...)
音頻、視頻 API
Canvas
webSocket
localStorage/sessionStorage
CSS3
新的選擇器(屬性、偽類、偽元素)
顏色新增 RGBA/HSLA 模式
過渡效果:transition,可實現動畫效果
自定義動畫
媒體查詢
盒子模型
JavaScript 相關
談一談原型和原型鏈
首先,解釋一下什么是原型:
每一個 JS 對象在被創(chuàng)建的時候,就會與之關聯另一個對象,這個對象就是我們所說的原型,每一個對象都會從原型上繼承屬性
每一個 JS 對象在被創(chuàng)建的時候,都具有一個屬性:__proto__?,這個屬性會指向該對象的原型。要知道,原型也是一個對象?,既然這樣,那么他的__proto__?指向Object?的Object?的原型
那么,Obeject 的原型的原型是什么?
答案應是:null
無法再往上層進行查找...這樣通過__proto__?向上一直查找所形成的鏈式結構,就是原型鏈。
淺克隆和深克隆
什么是淺克隆?什么是深克隆?
淺克隆中原始類型為值傳遞,對象類型仍未引用傳遞;深克隆中所有元素或者屬性都可以進行完全的復制,生成一個與原對象完全不相干的對象,也就是新對象中的所有修改都不會在原對象中有所表現。
如何實現淺克隆?
JS 內部實現了淺拷貝Object.assign()?,第一個參數是最終復制的目標對象,后面的所有參數是我們即將復制的原對象。(該方法適用于數組或者對象)
varnewObj =Object.assign({},obj)復制代碼
原生 JS 實現
functionshallowCopy(source) {letnewSource = {};for(iteminsource) {if(source.hasOwnProperty(key)) {? ? ? newSource[key] =source[key];? ? }? }returnnewSource;}復制代碼
如何實現深克隆?
使用 JSON 序列化
newSource =JSON.parse(JSON.stringfy(source))復制代碼
但是該方法有一點的缺陷:
undefinedsymbol
三方類庫,類似 lodash 的_.cloneDeep()
自己手動實現(簡易版)
functiondeepClone(source) {if(typeofsource!=='object') {return'不是對象';? }letisArray = Array.isArray(source)letnewSource = isArray ? [] : {}for(letkeyinsource) {if(typeofsource[key] !=='object') {? ? ? newSource[key] =source[key]? ? }else{? ? ? newSource[key] = deepClone(source[key])? ? }? }returnnewSource}復制代碼