如何合并两个数组值并覆盖替换空值

Question

假设我有两个数组

var arr1 = [{
    "x": "Jan 2020",
    "y": 1
}, {
    "x": "Feb 2020",
    "y": 0
}, {
    "x": "Mar 2020",
    "y": 3
}, {
    "x": "Apr 2020",
    "y": 0
}, {
    "x": "May 2020",
    "y": 5
}, {
    "x": "Jun 2020",
    "y": 0
}, {
    "x": "Jul 2020",
    "y": 7
}, {
    "x": "Aug 2020",
    "y": 0
}, {
    "x": "Sep 2020",
    "y": 9
}, {
    "x": "Oct 2020",
    "y": 0
}, {
    "x": "Nov 2020",
    "y": 11
}, {
    "x": "Dec 2020",
    "y": 0
}]

var arr2 = [{
    "x": "Feb 2020",
    "y": 2
}, {
    "x": "Apr 2020",
    "y": 4
}, {
    "x": "Jun 2020",
    "y": 6
}, {
    "x": "Aug 2020",
    "y": 8
}, {
    "x": "Oct 2020",
    "y": 10
}, {
    "x": "Dec 2020",
    "y": 12
}]

我只想这样合并

var res = [{
    "x": "Jan 2020",
    "y": 1
}, {
    "x": "Feb 2020",
    "y": 2
}, {
    "x": "Mar 2020",
    "y": 3
}, {
    "x": "Apr 2020",
    "y": 4
}, {
    "x": "May 2020",
    "y": 5
}, {
    "x": "Jun 2020",
    "y": 6
}, {
    "x": "Jul 2020",
    "y": 7
}, {
    "x": "Aug 2020",
    "y": 8
}, {
    "x": "Sep 2020",
    "y": 9
}, {
    "x": "Oct 2020",
    "y": 10
}, {
    "x": "Nov 2020",
    "y": 11
}, {
    "x": "Dec 2020",
    "y": 12
}]

Answer 1

您必须实现自定义逻辑，例如

const resultArray = [...arr1]
for (let i in arr1) {
  const overrideValueInArray2 = arr2.find(item => item.x === arr1[i].x)
  if (overrideValueInArray2) {
    resultArray[i] = overrideValueInArray2
  }
}

resultArray 应该包含预期的结果。

Answer 2

您可以使用Map，每个数组都有一个循环。

let arr1 = [{ x: "Jan 2020", y: 1 }, { x: "Feb 2020", y: 0 }, { x: "Mar 2020", y: 3 }, { x: "Apr 2020", y: 0 }, { x: "May 2020", y: 5 }, { x: "Jun 2020", y: 0 }, { x: "Jul 2020", y: 7 }, { x: "Aug 2020", y: 0 }, { x: "Sep 2020", y: 9 }, { x: "Oct 2020", y: 0 }, { x: "Nov 2020", y: 11 }, { x: "Dec 2020", y: 0 }],
    arr2 = [{ x: "Feb 2020", y: 2 }, { x: "Apr 2020", y: 4 }, { x: "Jun 2020", y: 6 }, { x: "Aug 2020", y: 8 }, { x: "Oct 2020", y: 10 }, { x: "Dec 2020", y: 12 }],
    map = new Map,
    fn =  ({ x, y }) => map.set(x, map.get(x) || y),
    result;

arr1.forEach(fn);
arr2.forEach(fn);

result = Array.from(map, ([x, y]) => ({ x, y }));

console.log(result);

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

Answer 3

您可以使用以下方法获得所需的输出：

• 将两个数组合并为一个。您可以为此使用spread syntax。
• 使用 reduce() 和 Object.assign() 创建一个对象，该对象具有来自对象的值作为要用于合并的键，即在您的情况下为 x。
• 使用Object.values() 获取结果数组。

const arr1 = [{"x": "Jan 2020","y": 1}, {"x": "Feb 2020","y": 0}, {"x": "Mar 2020","y": 3}, {"x": "Apr 2020","y": 0}, {"x": "May 2020","y": 5}, {"x": "Jun 2020","y": 0}, {"x": "Jul 2020","y": 7}, {"x": "Aug 2020","y": 0}, {"x": "Sep 2020","y": 9}, {"x": "Oct 2020","y": 0}, {"x": "Nov 2020","y": 11}, {"x": "Dec 2020","y": 0}];
const arr2 = [{"x": "Feb 2020","y": 2}, {"x": "Apr 2020","y": 4}, {"x": "Jun 2020","y": 6}, {"x": "Aug 2020","y": 8}, {"x": "Oct 2020","y": 10}, {"x": "Dec 2020","y": 12}];

const result = Object.values(
  [...arr1, ...arr2].reduce((r, c) => (r[c.x] = Object.assign({}, c), r), {})
);

console.log(result);

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

Answer 4

在这样的结构中，您使用y: 0 作为占位符并且arr2 已经正确排序。您可以将.map() 替换为arr1 并将所有元素替换为y: 0。

const arr1 = [{"x": "Jan 2020","y": 1}, {"x": "Feb 2020","y": 0}, {"x": "Mar 2020","y": 3}, {"x": "Apr 2020","y": 0}, {"x": "May 2020","y": 5}, {"x": "Jun 2020","y": 0}, {"x": "Jul 2020","y": 7}, {"x": "Aug 2020","y": 0}, {"x": "Sep 2020","y": 9}, {"x": "Oct 2020","y": 0}, {"x": "Nov 2020","y": 11}, {"x": "Dec 2020","y": 0}];
const arr2 = [{"x": "Feb 2020","y": 2}, {"x": "Apr 2020","y": 4}, {"x": "Jun 2020","y": 6}, {"x": "Aug 2020","y": 8}, {"x": "Oct 2020","y": 10}, {"x": "Dec 2020","y": 12}];

let i = 0;
const result = arr1.map(element => element.y ? element : arr2[i++]);

console.log(result);

这使用了0 是虚假的这一事实，但是如果您愿意，您也可以更明确地将element.y 替换为element.y == 0。 condition ? exprIfTrue : exprIfFalse 语法称为conditional operator。