Bagaimanakah anda boleh mencari dan mewakili perbezaan yang mendalam antara dua objek JavaScript bersarang dalam dengan berkesan?

Mencari Perbezaan Antara Dua Objek Bersarang Dalam

Masalah: Kira perbezaan mendalam antara dua objek JavaScript bersarang dalam, menggabungkan teknik perwakilan dengan jelas mengenalpasti perubahan.

Butiran: Memandangkan dua objek, oldObj dan newObj, algoritma diff tersuai diperlukan untuk menentukan perbezaan antara mereka, termasuk perubahan dalam nilai, struktur dan susunan tatasusunan. Output hendaklah diwakili dengan cara yang jelas dan boleh disiri JSON.

Penyelesaian:

Kelas tersuai, deepDiffMapper, direka bentuk untuk menangani masalah ini:

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
    ...
  }
}();

Penggunaan:

Untuk menggunakan ini kelas, hanya panggil kaedah peta dengan dua objek sebagai argumen:

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

Output:

Kaedah peta mengembalikan objek yang mewakili perbezaan antara dua input objek. Kekunci objek ini sepadan dengan sifat dalam newObj. Setiap nilai itu sendiri adalah objek dengan sifat berikut:

• jenis: Jenis perubahan (dicipta, dikemas kini, dipadam atau tidak diubah)
• data: Nilai yang dikemas kini atau baharu ( sekiranya tercipta atau kemas kini)

Contoh:

Memandangkan objek input berikut:

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')
};

Kaedah peta akan mengembalikan objek berikut yang mewakili perbezaan:

{
  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'
          }
        }
      }
    }
  }
}

Perwakilan ini jelas menunjukkan perubahan yang dibuat pada objek, menyerlahkan yang dibuat, dikemas kini dan sifat dipadamkan.

Atas ialah kandungan terperinci Bagaimanakah anda boleh mencari dan mewakili perbezaan yang mendalam antara dua objek JavaScript bersarang dalam dengan berkesan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!