`

shallowEqual

 
阅读更多

shallowEqual比较值相等,或者对象含有相同的属性、且属性值相等。

 

'use strict';

var hasOwnProperty = Object.prototype.hasOwnProperty;

// 比较值相等
function is(x, y) {
  // SameValue algorithm
  if (x === y) {
    // Steps 1-5, 7-10
    // Steps 6.b-6.e: +0 != -0
    // Added the nonzero y check to make Flow happy, but it is redundant
    return x !== 0 || y !== 0 || 1 / x === 1 / y;
  } else {
    // Step 6.a: NaN == NaN
    return x !== x && y !== y;
  }
}

// 比较值相等,或者对象含有相同的键,其属性值相等
function shallowEqual(objA, objB) {
  if (is(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;
  }

  for (var i = 0; i < keysA.length; i++) {
    if (!hasOwnProperty.call(objB, keysA[i]) || !is(objA[keysA[i]], objB[keysA[i]])) {
      return false;
    }
  }

  return true;
}

module.exports = shallowEqual;

 

0
0
分享到:
评论

相关推荐

    component-render-mixin:React 的shallowEqual 和自定义shallowEqualProps

    `shallowEqual`是一个用于比较对象是否浅层相等的函数,它被用在React的内部,主要用于判断组件的props或state是否发生变化,从而决定是否需要重新渲染组件。这篇讨论将深入探讨React内置的`shallowEqual`以及如何...

    shallowequal:Like像lodash v3.x isEqualWith,但浅浅等于

    浅等 shallowequal相等类似于lodash的 (v3.10.1),但对于浅(严格)相等。 shallowequal(value, other, [customizer], [thisArg]) 在两个值(即value和other )之间执行浅等式比较,以确定它们是否等效。 如果...

    js代码-shallow equal

    这个`shallowEqual`函数首先检查两个对象的引用是否相同,然后比较它们的属性数量,最后遍历每个属性进行值的比较。如果所有属性都相等,那么这两个对象就是浅等的。 然而,浅比较有一个限制:它不考虑嵌套的对象或...

    前端大厂最新面试题-improve_render.docx

    shallowEqual 是一个浅比较算法,它可以比较两个对象的浅层次结构。如果两个对象的浅层次结构相同,则返回 true,否则返回 false。 四、避免不必要的渲染实践 在实际业务场景中,需要采取措施来避免不必要的渲染。...

    React数据可视化应用实践.pdf

    同时提到了shallowEqual策略,即比较props和state的对象引用和第一层属性。 2. 组件扁平化属性的设计。通过扁平化的数据结构,只比较第一层属性,可以充分利用浅比较的优势,避免不必要的对象创建,从而提升性能。 ...

    Recompose:用于功能组件和高阶组件的React Utility Belt-开源

    许多React库最终都会一遍又一遍地实现相同的实用程序,例如shallowEqual和getDisplayName。 Recompose为您提供了这些实用程序。 尽管Recompose鼓励尽可能使用功能组件,但它可与常规React组件一起使用。

    React之PureComponent的使用作用

    PureComponent 的浅比较逻辑是通过 shallowEqual 函数实现的,该函数比较对象的键值是否一致,每一个键是否两者都有,并且是否是一个引用。这种浅比较方式只能比较第一层的值,对于深层的嵌套数据是无法比较的。 在...

Global site tag (gtag.js) - Google Analytics