如何有效地找到并表示两个深度嵌套的 JavaScript 对象之间的深层差异？

查找两个深层嵌套对象之间的差异

问题：计算两个深层嵌套 JavaScript 对象之间的深层差异，结合表示技术来清楚地了解识别变化。

详细信息：给定两个对象， oldObj 和 newObj，需要自定义 diff 算法来确定它们之间的差异，包括值、结构和数组顺序的变化。输出应以清晰且可 JSON 序列化的方式表示。

解决方案：

自定义类 deepDiffMapper 旨在解决此问题问题：

var deepDiffMapper = function () {
  return {

    // Constants representing change types
    VALUE_CREATED: 'created',
    VALUE_UPDATED: 'updated',
    VALUE_DELETED: 'deleted',
    VALUE_UNCHANGED: 'unchanged',

    map: function(obj1, obj2) {
      // Algorithm for comparing objects

      return diff;
    },
    
    compareValues: function (value1, value2) {
      // Logic for determining value changes
      
      return result;
    },

    // Helper functions to identify object types
    ...
  }
}();

用法：

要使用此类，只需以两个对象作为参数调用 map 方法：

var result = deepDiffMapper.map(oldObj, newObj);

输出：

map 方法返回一个表示两个输入对象之间的差异。该对象的键对应于 newObj 中的属性。每个值本身都是一个具有以下属性的对象：

• 类型：更改的类型（创建、更新、删除或未更改）
• 数据：更新或新值（如果有创作或update)

示例：

给定以下输入对象：

var oldObj = {
  a: 'i am unchanged',
  b: 'i am deleted',
  e: {
    a: 1,
    b: false,
    c: null
  },
  f: [1, {
    a: 'same',
    b: [{
      a: 'same'
    }, {
      d: 'delete'
    }]
  }],
  g: new Date('2017.11.25')
};

var newObj = {
  a: 'i am unchanged',
  c: 'i am created',
  e: {
    a: '1',
    b: '',
    d: 'created'
  },
  f: [{
    a: 'same',
    b: [{
      a: 'same'
    }, {
      c: 'create'
    }]
  }, 1],
  g: new Date('2017.11.25')
};

map 方法将返回以下表示差异：

{
  b: {
    type: 'deleted',
    data: undefined
  },
  c: {
    type: 'created',
    data: 'i am created'
  },
  e: {
    a: {
      type: 'updated',
      data: '1'
    },
    b: {
      type: 'updated',
      data: ''
    },
    d: {
      type: 'created',
      data: 'created'
    }
  },
  f: {
    1: {
      type: 'deleted',
      data: undefined
    },
    2: {
      b: {
        1: {
          d: {
            type: 'deleted',
            data: undefined
          }
        },
        2: {
          c: {
            type: 'created',
            data: 'create'
          }
        }
      }
    }
  }
}

此表示清楚地显示了对对象所做的更改，突出显示创建、更新和删除属性。

以上是如何有效地找到并表示两个深度嵌套的 JavaScript 对象之间的深层差异？的详细内容。更多信息请关注PHP中文网其他相关文章！