前端知識梳理

2021-09-24 08:04:18 字數 1960 閱讀 6319

保證內部一致性

使併發更新變得可行:react 可以根據 setstate() 來自的不同的位置:事件控制代碼,網路響應,動畫等,來為它們分配不同的優先順序。

鉤子函式(函式元件不能使用這些方法,因為這需要繼承react component這個類)

getinitialstate()

componentwillmount()

render()

componentdidmount()

componentwillreceiveprops(nextprops)

shouldcomponentupdate(nextprops, nextstate)

false:不更新元件

componentwillupdate(nextprops, nextstate)

re- render() 重新呼叫

componentdidupdate(prevprops, prevstate)

componentwillunmount()

16版本新增生命週期

getsnapshotbeforeupdate()

無狀態子元件

react.createcontext() 會建立乙個 context 物件(例如 testcontext)

context 從哪來

為什麼要用父宣告子申請的設計

**設計上不應該在reducer裡用 if-else/switch 來取針對不同的 action.type做業務處理,service code 不應該寫在這一層,應該用 myactionsaction.type 解耦。dva就是做了這件事,把 action處理單獨抽出來

多個 reducer 的場景:let store = redux.createstore(redux.combinereducers());action觸發流:

immutability(不可變性)

react 結合

非同步資料處理

模組 beforemount

mounted

beforeupdate

updated

beforedestroy

destroyed

其他鉤子

v-on:click = @click

v-model

v-for

樣式處理 v-bind

v-if: 根據表示式的值的真假條件,銷毀或重建元素

v-show: 根據表示式之真假值,切換元素的 display css 屬性

效能和體驗

v-pre: 跳過這個元素和它的子元素的編譯過程。可以用來顯示原始 mustache 標籤,跳過大量沒有指令的節點會加快編譯。

v-once: 只渲染元素和元件一次。隨後的重新渲染,元素/元件及其所有的子節點將被視為靜態內容並跳過。這可以用於優化更新效能。

自定義指令

process.nexttick(function

tick

() );

複製**

function realsum(...args) 

function sum(...args1) ;

fn.valueof = () => value;

return fn;

}sum(1,2)(3)(4)(2,3).valueof(); // 15

複製**

function findsymmetricnum(min, max) 

num ++;

}return result;

};複製**

複製**

回源

更新資料

多網域名稱查詢優化

前端知識重新梳理 1

先上定義 display block 塊級元素 1,每個塊級元素會獨佔一行 2,缺省會自動填滿父級寬度 3,塊級元素可以設定padding和margindisplay inline 內聯元素 1,內聯元素不會獨佔一行,多個相鄰的內聯元素會排列在同一行裡,直到一行排列不下,才會新換一行,其寬度隨元素的...

前端知識體系梳理

高頻考題 盒模型 動畫 css3 預處理器 sass less postcss.基礎其他題目 書籍推薦基礎 原型 繼承 事件流 事件委託 變數 作用域 閉包 this 上下文 事件迴圈 前端快取 正則 跨域 settimeout setinterval requestanimationframe 深...

我的前端知識梳理 HTML,CSS篇

1.行內樣式 1000 2.id 0100 3.類選擇器 偽類選擇器 屬性選擇器 type text 0010 4.標籤選擇器 偽元素選擇器 first line 0001 5.萬用字元 子選擇器 相鄰選擇器 0000 1 顏色 新增rgba hsla模式 2 文字陰影 text shadow 3 ...