hoc, render porps, hooks 的對比和用處
- 都是react解決狀態(tài)共享和邏輯復用的方法
- hooks 是16.8后推出的，不用嵌套，不用修改組件層級，簡單易用
虛擬dom是什么
- 什么是vdom？
vdom是用js對象來描述真實dom 結構，是對真實dom的映射 - 有什么用？
操作真實dom 是耗性能的，vdom用來減少dom的操作，是對渲染的抽象，可以用于多端 - 怎么用？
每次修改狀態(tài)， 組件會生成新的vdom，新舊vdom進行diff算法對比，最終生成新的vdom, 視圖更新
diff算法？
新舊vdom tree對比
遵循三個原則
- 同層對比
將傳統(tǒng)的樹節(jié)點的對比的時間復雜度從o(n^3)降為o(n) - 對比父節(jié)點的tag, type
如果不是相同的父節(jié)點，則銷毀重建 - 同層子節(jié)點使用key標記，來進行匹配復用
子節(jié)點上標記唯一的key, 根據key來匹配相同的子節(jié)點，進行位移復用，若無匹配，則新建，若匹配完成后，舊節(jié)點還有剩余子節(jié)點，則銷毀
jsx原理
實際調用了react.createElement(type, props, ...children)
用來生成vnode
createElement根據type，如果是class，則createComponent, 繼承copponent,合并配置，生成vnode
自定義的react組件為何必須大寫
用來區(qū)別原生標簽，便于瀏覽器識別解析
babel在編譯過程中判讀組件的首字母，如果小寫則為原生dom標簽，編譯為字符串，如果大寫則判讀為自定義組件，編譯為組件
setState是同步還是異步？
這里的異步不是指異步代碼實現，指的是先收集變更，放入隊列中，然后統(tǒng)一進行批量更新
- 異步 合成事件和鉤子函數中
調用this.updater.enqueue
就是將回調事件放到updteQueue中，
判斷isbathupdates 是否批量更新
bathupdates 通過 transcation(事務)機制來完成
事務機制類似一個黑盒子，在開始和結束階段來添加邏輯
init中初始化updatequeue,
setstate將事件放入updatequeue中
close階段將updatequeue進行flush
---- vue通過js eventloop實現 - 同步
放在setTimeout中活著原生dom通過addeventListener綁定的事件中
react 如何實現自己的事件機制？
- 注冊事件 事件依賴關聯， 形成map
- 合成事件 綁定事件 document.addEventlister, 收集事件回調函數
- 觸發(fā)事件 dispatchEvent, 內部模擬了事件觸發(fā)
動畫淺析REACT事件系統(tǒng)和源碼
聊聊fiber架構
為什么引入？
渲染線程和js引擎線程互斥
15及以前版本渲染采用同步，碰到嵌套過深或渲染耗時的組件，頁面會卡頓阻塞，用戶體驗差
fiber架構，讓渲染有優(yōu)先級，可中斷，
利用時間片的概念，每個任務上攜帶expirestime(過期時間),通過expirestime 對比判斷任務的優(yōu)先級，如何碰到優(yōu)先級高的任務，組件暫停渲染，將執(zhí)行棧交給優(yōu)先級高的任務先執(zhí)行，執(zhí)行完后，在暫停渲染的組件處重新開始渲染，利用來瀏覽器api requesIdleCallback(利用瀏覽器空閑時間來處理任務)來實現
react事件中為什么要綁定this或者要用箭頭函數
this指向的問題
this指向不是定義時的環(huán)境，而是執(zhí)行時綁定環(huán)境，指向underfind（嚴格模式下）
綁定this指向組件實列
constructor中 bind this, 只操作一次
箭頭函數，每次都會重新生成
