前端vue2如何对比两个数组对象，数组对象二与数组对象一对比，哪个元素修改了，哪个元素新增了，哪个元素删除了，并在各自的原数组打上对应的标记

在Vue.js中，尤其是在处理数组变更时，通常我们会使用`Array.prototype.diff()`这样的第三方库来进行深度比较，如vue-diff-utils。如果没有现成库，我们可以手动实现一个基本的对比函数，步骤大致如下：

1. 首先，创建一个新的数组，用于存放新版本的元素。
2. 使用`filter()`遍历第一个数组（假设为array1），检查每个元素是否存在于第二个数组（array2）中。如果存在并且属性有变化，添加到新的数组并标记修改；如果不存在，标记为删除。
3. 对于array2中剩余的元素，它们既未在array1中找到也未标记为删除，所以它们是新增的。

以下是简单的伪代码实现：

function compareArrays(array1, array2) {
  let modified = [];
  let deleted = [];
  let added = [];

  // 新建一个包含array2所有元素的新数组，标记初始状态
  let newArray = array2.map(item => ({...item, isOriginal: true}));

  // 检查array1中每个元素在array2的变化情况
  array1.forEach(item => {
    const index = newArray.findIndex(obj => obj.id === item.id); // 假设id作为唯一标识符
    if (index !== -1) { // 存在
      let diff = JSON.stringify(newArray[index]) !== JSON.stringify(item);
      if (diff) {
        modified.push({ ...newArray[index], isModified: true });
      }
      newArray[index].isOriginal = false; // 标记已更新
    } else {
      deleted.push(item); // 未在array2中找到，标记为删除
    }
  });

  // array2中剩下的就是新增的
  added = newArray.filter(obj => obj.isOriginal);

  return {
    modified,
    deleted,
    added
  };
}

// 使用示例
const result = compareArrays(array1, array2);