比较两个数组并在JS中添加缺失的对象答案

【问题标题】：Comparing two array and adding missing objects in JS比较两个数组并在JS中添加缺失的对象
【发布时间】：2020-08-28 05:46:04
【问题描述】：

我有两个大数组，我想比较两个数组并将缺少的数据从 arrayOne 添加到 arrayTwo

这是我的一些数据

const arrayOne = [
  {
    id: "This Year",
    data: [
      { x: "01-02", y: "81" },
      { x: "01-03", y: "361" },
      { x: "01-04", y: "64" },
      { x: "01-05", y: "169" },
      { x: "01-06", y: "9" },
      { x: "01-07", y: "100" },
      { x: "01-08", y: "144" },
      { x: "01-09", y: "81" },
      { x: "01-10", y: "256" },
      { x: "01-11", y: "81" },
      { x: "01-12", y: "144" },
      { x: "01-13", y: "144" },
      { x: "01-14", y: "225" },
      { x: "01-15", y: "289" },
      { x: "01-16", y: "81" },
      { x: "01-17", y: "64" },
      { x: "01-18", y: "64" },
      { x: "01-19", y: "121" },
      { x: "01-20", y: "25" },
      { x: "01-21", y: "49" },
      { x: "01-22", y: "16" },
      { x: "01-23", y: "49" },
      { x: "01-24", y: "196" },
      { x: "01-25", y: "16" },
      { x: "01-26", y: "25" },
      { x: "01-27", y: null },
      { x: "01-28", y: "144" },
      { x: "01-29", y: "100" },
      { x: "01-30", y: "64" },
      { x: "01-31", y: "144" },
      { x: "02-01", y: "100" },
      { x: "02-02", y: "100" },
      { x: "02-03", y: "49" },
    ],
  },
];

const arrayTwo = [
  {
    id: "This Year",
    data: [
      { x: "01-02", y: "64" },
      { x: "01-03", y: "25" },
      { x: "01-04", y: "25" },
      { x: "01-05", y: "169" },
      { x: "01-15", y: "64" },
      { x: "01-16", y: "121" },
      { x: "01-17", y: "49" },
      { x: "01-18", y: "81" },
      { x: "01-19", y: "49" },
    ],
  },
];

我尝试将其映射并与 x 进行比较，但我无法获得理想的输出

arrayOne[0].data.map((date, index) => {
    arrayTwo[0].data.map((newDate, newIndex) => {
  if (date.x !== newDate.x) {
      arrayTwo[0].data.push({x:date.x, y: null })
    }
    });
  });

我想检查 arrayTwo[data] 中的数据是否缺失，如果缺失，然后从 arrayOne[data] 添加该数据（即获取带有 x 值的对象，但将 y 值设置为 null）

期望的输出：

[
  {
    "id":"This Year",
    "data":[
      {"x":"01-02", "y":"64"},
      {"x":"01-03", "y":"25"},
      {"x":"01-04", "y":"25"},
      {"x":"01-05", "y":"169"},
      {"x":"01-06", "y":null},
      {"x":"01-07", "y":null},
      {"x":"01-08", "y":null},
      {"x":"01-09", "y":null},
      {"x":"01-10", "y":null},
      {"x":"01-11", "y":null},
      {"x":"01-12", "y":null},
      {"x":"01-13", "y":null},
      {"x":"01-14", "y":null},
      {"x":"01-15", "y":"64"},
      {"x":"01-16", "y":"121"},
      {"x":"01-17", "y":"49"},
      {"x":"01-18", "y":"81"},
      {"x":"01-19", "y":"49"},
      {"x":"01-20", "y":null},
      {"x":"01-21", "y":null},
      {"x":"01-22", "y":null},
      {"x":"01-23", "y":null},
      {"x":"01-24", "y":null},
      {"x":"01-25", "y":null},
      {"x":"01-26", "y":null},
      {"x":"01-27", "y":null},
      {"x":"01-28", "y":null},
      {"x":"01-29", "y":null},
      {"x":"01-30", "y":null},
      {"x":"01-31", "y":null},
      {"x":"02-01", "y":null},
      {"x":"02-02", "y":null},
      {"x":"02-03", "y":null}
    ]
  }
]

【问题讨论】：

问题/问题是？
@Andreas 我无法实现它/
比较的关键是什么，还是要检查整个对象和整个对象
在您的输出中，您想要来自arrayOne 的{"x": "01-19", "y": "121"}，还是想要arrayTwo {"x": "01-19", "y": "49"} 中存在的以下内容？我相信后者通过阅读您的问题和@EugenSunic 的回答正在做相反的事情（这将是一个简单的解决方法来扭转行为）
好的，所以下面的答案目前都没有给出这种行为。我现在将所需的输出添加到您的问题中，请确认这是正确的。如果是这样，我的更新答案（第二个示例）现在给出了所需的输出。

标签： javascript arrays json multidimensional-array ecmascript-6

【解决方案1】：

试试这样的：

遍历元素，如果在第一个数组中找不到它们，则将它们添加到第二个数组中

const arrayOne = [
  {
    id: "This Year",
    data: [
      { x: "01-02", y: "81" },
      { x: "01-03", y: "361" },
      { x: "01-04", y: "64" },
      { x: "01-05", y: "169" },
      { x: "01-06", y: "9" },
      { x: "01-07", y: "100" },
      { x: "01-08", y: "144" },
      { x: "01-09", y: "81" },
      { x: "01-10", y: "256" },
      { x: "01-11", y: "81" },
      { x: "01-12", y: "144" },
      { x: "01-13", y: "144" },
      { x: "01-14", y: "225" },
      { x: "01-15", y: "289" },
      { x: "01-16", y: "81" },
      { x: "01-17", y: "64" },
      { x: "01-18", y: "64" },
      { x: "01-19", y: "121" },
      { x: "01-20", y: "25" },
      { x: "01-21", y: "49" },
      { x: "01-22", y: "16" },
      { x: "01-23", y: "49" },
      { x: "01-24", y: "196" },
      { x: "01-25", y: "16" },
      { x: "01-26", y: "25" },
      { x: "01-27", y: null },
      { x: "01-28", y: "144" },
      { x: "01-29", y: "100" },
      { x: "01-30", y: "64" },
      { x: "01-31", y: "144" },
      { x: "02-01", y: "100" },
      { x: "02-02", y: "100" },
      { x: "02-03", y: "49" }
    ]
  }
];

const arrayTwo = [
  {
    id: "This Year",
    data: [
      { x: "01-02", y: "64" },
      { x: "01-03", y: "25" },
      { x: "01-04", y: "25" },
      { x: "01-05", y: "169" },
      { x: "01-15", y: "64" },
      { x: "01-16", y: "121" },
      { x: "01-999", y: "49" },
      { x: "01-18", y: "81" },
      { x: "01-19", y: "49" }
    ]
  }
];

console.log(arrayOne);
arrayTwo[0].data.forEach(obj => {
  const found = arrayOne[0].data.find(obj2 => obj2.x === obj.x);
  if (!found) {
    arrayOne[0].data.push(obj);
  }
});

console.log(arrayOne);

【讨论】：

从@Rizwan Ahmed Shivalli 的问题中说“我想检查 arrayTwo[data] 中的数据是否缺失，如果缺失，然后从 arrayOne[data] 添加该数据”，但您有以下内容您的输出：{"x": "01-19", "y": "121"} 这显然来自arrayOne，而arrayTwo {"x": "01-19", "y": "49"} 中存在以下内容，因此（如果我正确理解问题）应该出现在输出中

【解决方案2】：

你可以这样做：

使用reduce从arrayOne[0].data创建一个对象(objOne)
如果键存在于arrayTwo[0].data 中，则覆盖objOne 的任何属性，再次使用reduce 并使用objOne 作为初始值。
将此objOne 转换为带有Object.values(objOne) 的数组，然后将其设置为arrayTwo[0].data 的属性

两个 reduce 函数的时间复杂度应该是 O(n + m)（其中 n 和 m 是两个数组的长度）。（应该比对其中一个数组中的每个元素使用 find 更快）

代码关键部分：

const objOne = arrayOne[0].data.reduce((aggObj, item) => {
  aggObj[item.x] = item;  
  return aggObj;
}, {});

const mergedObjOutput = arrayTwo[0].data.reduce((aggObj, item) => {
  aggObj[item.x] = item;  
  return aggObj;
}, objOne)

const mergedFinalOutput = [...arrayTwo];
mergedFinalOutput[0].data = Object.values(mergedObjOutput);

console.log(mergedFinalOutput);

完整演示：

const arrayOne = [
  {
    id: "This Year",
    data: [
      { x: "01-02", y: "81" },
      { x: "01-03", y: "361" },
      { x: "01-04", y: "64" },
      { x: "01-05", y: "169" },
      { x: "01-06", y: "9" },
      { x: "01-07", y: "100" },
      { x: "01-08", y: "144" },
      { x: "01-09", y: "81" },
      { x: "01-10", y: "256" },
      { x: "01-11", y: "81" },
      { x: "01-12", y: "144" },
      { x: "01-13", y: "144" },
      { x: "01-14", y: "225" },
      { x: "01-15", y: "289" },
      { x: "01-16", y: "81" },
      { x: "01-17", y: "64" },
      { x: "01-18", y: "64" },
      { x: "01-19", y: "121" },
      { x: "01-20", y: "25" },
      { x: "01-21", y: "49" },
      { x: "01-22", y: "16" },
      { x: "01-23", y: "49" },
      { x: "01-24", y: "196" },
      { x: "01-25", y: "16" },
      { x: "01-26", y: "25" },
      { x: "01-27", y: null },
      { x: "01-28", y: "144" },
      { x: "01-29", y: "100" },
      { x: "01-30", y: "64" },
      { x: "01-31", y: "144" },
      { x: "02-01", y: "100" },
      { x: "02-02", y: "100" },
      { x: "02-03", y: "49" },
    ],
  },
];

const arrayTwo = [
  {
    id: "This Year",
    data: [
      { x: "01-02", y: "64" },
      { x: "01-03", y: "25" },
      { x: "01-04", y: "25" },
      { x: "01-05", y: "169" },
      { x: "01-15", y: "64" },
      { x: "01-16", y: "121" },
      { x: "01-17", y: "49" },
      { x: "01-18", y: "81" },
      { x: "01-19", y: "49" },
    ],
  },
];

const objOne = arrayOne[0].data.reduce((aggObj, item) => {
  aggObj[item.x] = item;  
  return aggObj;
}, {});

const mergedObjOutput = arrayTwo[0].data.reduce((aggObj, item) => {
  aggObj[item.x] = item;  
  return aggObj;
}, objOne)

const mergedFinalOutput = [...arrayTwo];
mergedFinalOutput[0].data = Object.values(mergedObjOutput);

console.log(mergedFinalOutput);

.as-console-wrapper { max-height: 100% !important; top: 0; }

更新

如果您真的想要这样的输出（根据您在问题下的 cmets 中的说明）：

[
  {
    "id":"This Year",
    "data":[
      {"x":"01-02", "y":"64"},
      {"x":"01-03", "y":"25"},
      {"x":"01-04", "y":"25"},
      {"x":"01-05", "y":"169"},
      {"x":"01-06", "y":null},
      {"x":"01-07", "y":null},
      {"x":"01-08", "y":null},
      {"x":"01-09", "y":null},
      {"x":"01-10", "y":null},
      {"x":"01-11", "y":null},
      {"x":"01-12", "y":null},
      {"x":"01-13", "y":null},
      {"x":"01-14", "y":null},
      {"x":"01-15", "y":"64"},
      {"x":"01-16", "y":"121"},
      {"x":"01-17", "y":"49"},
      {"x":"01-18", "y":"81"},
      {"x":"01-19", "y":"49"},
      {"x":"01-20", "y":null},
      {"x":"01-21", "y":null},
      {"x":"01-22", "y":null},
      {"x":"01-23", "y":null},
      {"x":"01-24", "y":null},
      {"x":"01-25", "y":null},
      {"x":"01-26", "y":null},
      {"x":"01-27", "y":null},
      {"x":"01-28", "y":null},
      {"x":"01-29", "y":null},
      {"x":"01-30", "y":null},
      {"x":"01-31", "y":null},
      {"x":"02-01", "y":null},
      {"x":"02-02", "y":null},
      {"x":"02-03", "y":null}
    ]
  }
]

那么这是演示：

const arrayOne = [
  {
    id: "This Year",
    data: [
      { x: "01-02", y: "81" },
      { x: "01-03", y: "361" },
      { x: "01-04", y: "64" },
      { x: "01-05", y: "169" },
      { x: "01-06", y: "9" },
      { x: "01-07", y: "100" },
      { x: "01-08", y: "144" },
      { x: "01-09", y: "81" },
      { x: "01-10", y: "256" },
      { x: "01-11", y: "81" },
      { x: "01-12", y: "144" },
      { x: "01-13", y: "144" },
      { x: "01-14", y: "225" },
      { x: "01-15", y: "289" },
      { x: "01-16", y: "81" },
      { x: "01-17", y: "64" },
      { x: "01-18", y: "64" },
      { x: "01-19", y: "121" },
      { x: "01-20", y: "25" },
      { x: "01-21", y: "49" },
      { x: "01-22", y: "16" },
      { x: "01-23", y: "49" },
      { x: "01-24", y: "196" },
      { x: "01-25", y: "16" },
      { x: "01-26", y: "25" },
      { x: "01-27", y: null },
      { x: "01-28", y: "144" },
      { x: "01-29", y: "100" },
      { x: "01-30", y: "64" },
      { x: "01-31", y: "144" },
      { x: "02-01", y: "100" },
      { x: "02-02", y: "100" },
      { x: "02-03", y: "49" },
    ],
  },
];

const arrayTwo = [
  {
    id: "This Year",
    data: [
      { x: "01-02", y: "64" },
      { x: "01-03", y: "25" },
      { x: "01-04", y: "25" },
      { x: "01-05", y: "169" },
      { x: "01-15", y: "64" },
      { x: "01-16", y: "121" },
      { x: "01-17", y: "49" },
      { x: "01-18", y: "81" },
      { x: "01-19", y: "49" },
    ],
  },
];

const objOne = arrayOne[0].data.reduce((aggObj, item) => {
  aggObj[item.x] = {...item, y: null};  
  return aggObj;
}, {});

const mergedObjOutput = arrayTwo[0].data.reduce((aggObj, item) => {
  aggObj[item.x] = item;  
  return aggObj;
}, objOne)

const mergedFinalOutput = [...arrayTwo];
mergedFinalOutput[0].data = Object.values(mergedObjOutput);

console.log(mergedFinalOutput);

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：