PureComponent中的淺比較

react dom 18.2.0
shouldComponentUpdate
1、先用object.is判斷
2、在判斷A和B是否是null
3、A和B的keys長度比較
4、A和B的key是否相同 或者 A和B的value值是否相同

function shallowEqual(objA, objB) {
  if (objectIs(objA, objB)) {
    return true;
  }

  if (typeof objA !== 'object' || objA === null || typeof objB !== 'object' || objB === null) {
    return false;
  }

  var keysA = Object.keys(objA);
  var keysB = Object.keys(objB);

  if (keysA.length !== keysB.length) {
    return false;
  } // Test for A's keys different from B.


  for (var i = 0; i < keysA.length; i++) {
    var currentKey = keysA[i];

    if (!hasOwnProperty.call(objB, currentKey) || !objectIs(objA[currentKey], objB[currentKey])) {
      return false;
    }
  }

  return true;
}
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 為什么用 PureComponent ? PureComponent 是優(yōu)化 React 應(yīng)用程序最重要的方法之一...
    夏天_5de1閱讀 2,837評論 0 4
  • 前端開發(fā)面試題 <a name='preface'>前言</a> 只看問題點(diǎn)這里 看全部問題和答案點(diǎn)這里 本文由我...
    自you是敏感詞閱讀 904評論 0 3
  • PureComponent是react中創(chuàng)建組件的一種方式,可以減少不必要的更新,進(jìn)而提升性能,每次更新會自動幫你...
    指尖跳動閱讀 3,123評論 0 2
  • 前端開發(fā)面試題 面試題目: 根據(jù)你的等級和職位的變化,入門級到專家級,廣度和深度都會有所增加。 題目類型: 理論知...
    怡寶丶閱讀 2,686評論 0 7
  • 代碼切割 懶加載 React.lazy React.lazy 目前只支持默認(rèn)導(dǎo)出 異常捕獲邊界 基于路由的代碼分割...
    前端小白的摸爬滾打閱讀 290評論 0 0

友情鏈接更多精彩內(nèi)容