解释

Question

这是我的代码

我有2个对象数组-arr1和arr2

  var arr1 = [{
        id: 1,
        city: 'London',
        'checked': false
        },
        {
        id: 2,
        city: 'NYC',
        'checked': false
        },
        {
        id: 3,
        city: 'Paris',
        'checked': false
        },
        {
        id: 4,
        city: 'Madrid',
        'checked': false
        }];


 var arr2 = [{
        id: 1,
        city: 'Madrid',
        'checked': true
        },
        {
        id: 2,
        city: 'Paris',
        'checked': false
        },
        {
        id: 3,
        city: 'NYC',
        'checked': true
        },
        {
        id: 4,
        city: 'London',
        'checked': false
        }];

使用这两个对象数组，我想创建一个arr3变量/对象数组（arr3将保留arr1的顺序-首先是伦敦，然后是NYC，第三是巴黎，最后是马德里。我只想检查一下arr2对象并将该字段（选中的属性）值放在arr1中并创建arr3。顺序不应更改，仅arr1的选中项将从arr2的选中项获取其值。

  var arr3 = [{
        id: 1,
        city: 'London',
        'checked': false
        },
        {
        id: 2,
        city: 'NYC',
        'checked': true
        },
        {
        id: 3,
        city: 'Paris',
        'checked': false
        },
        {
        id: 4,
        city: 'Madrid',
        'checked': true
        }];

我也可以选择不使用arr3，然后直接在arr1中进行更改。这也是另一种方式。任何技术都对我有用。

已更新-arr3中id属性的顺序应与arr1中的顺序相同

Answer 1

解释

使用这种方法，它更多地使用了现代方法，对map和find之类的函数进行了恶意使用，此外，我个人认为该实现非常简单。。

如果您不熟悉“箭头功能”语法，则可以在线找到大量文档，例如this。但正如您所看到的，这种方法的优点在于它简洁，简洁，简单。

此实现与@holydragon提供的答案有些相似，但是，当您使用forEach函数时，至少使用此实现，通过使用{{ 1}}，这样可以减少代码中出现副作用的机会。

此外，我还使用了destructuring assignment，只是为了进一步减少此代码段中出现副作用的机会。

更新

我已经使用map实现了我的解决方案，不是因为它是“现代的”或类似的愚蠢之举。这是因为，如果不创建对象的副本，则在修改destructuring assignment中的对象的checked属性时，arr3中发现的对象的checked属性将也得到更新。

这是一个副作用示例，如果您想深入研究函数式编程，相关概念以及特别是JavaScript的函数式编程，我强烈建议您阅读Eric's的某些内容。我个人是Eric发布的内容的粉丝，当我尝试将功能性编程概念应用于JavaScript时，我发现他的内容很有用。

arr1

Answer 2

您可以将Array.prototype.map()与Array.prototype.find()结合使用。使用arr1.map(...)可以维护数组1的顺序，使用arr2.find(...)可以在checked中获得arr2属性值。

const arr1 = [{id: 1,city: 'London','checked': false},{id: 2,city: 'NYC','checked': false},{id: 3,city: 'Paris','checked': false},{id: 4,city: 'Madrid','checked': false}];
const arr2 = [{id: 1,city: 'Madrid','checked': true},{id: 2,city: 'Paris','checked': false},{id: 3,city: 'NYC','checked': true},{id: 4,city: 'London','checked': false}];
const arr3 = arr1.map(c1 => ({
  id: c1.id,
  city: c1.city,
  checked: arr2.find(c2 => c1.city === c2.city).checked
}));

console.log(arr3);

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

Answer 3

您可以使用Map并合并相同的城市。

var array1 = [{ city: 'London', checked: false }, { city: 'NYC', checked: false }, { city: 'Paris', checked: false }, { city: 'Madrid', checked: false }],
    array2 = [{ city: 'Madrid', checked: true }, { city: 'Paris', checked: false }, { city: 'NYC', checked: true }, { city: 'London', checked: false }],
    result = Array.from([...array1, ...array2]
        .reduce((m, o) => m.set(o.city, o), new Map)
        .values()
    );

console.log(result)

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

如果需要，您可以仅将所需属性分配给地图。

var array1 = [{ id: 1, city: 'London', checked: false }, { id: 2, city: 'NYC', checked: false }, { id: 3, city: 'Paris', checked: false }, { id: 4, city: 'Madrid', checked: false }],
    array2 = [{ id: 1, city: 'Madrid', checked: true }, { id: 2, city: 'Paris', checked: false }, { id: 3, city: 'NYC', checked: true }, { id: 4, city: 'London', checked: false }],
    result = Array.from([...array1, ...array2]
        .reduce((m, o) => m.set(
            o.city,
            Object.assign(m.get(o.city) || o, { checked: o.checked })
        ), new Map)
        .values()
    );

console.log(result)

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

Answer 4

（已更新）步骤：

遍历arr1。
从两个数组中的城市属性匹配的arr2中获取对象。
根据checked中匹配的对象更新arr1中的arr2属性。

var arr1 = [{
    id: 1,
    city: 'London',
    'checked': false
  },
  {
    id: 2,
    city: 'NYC',
    'checked': false
  },
  {
    id: 3,
    city: 'Paris',
    'checked': false
  },
  {
    id: 4,
    city: 'Madrid',
    'checked': false
  }
];


var arr2 = [{
    id: 1,
    city: 'Madrid',
    'checked': true
  },
  {
    id: 2,
    city: 'Paris',
    'checked': false
  },
  {
    id: 3,
    city: 'NYC',
    'checked': true
  },
  {
    id: 4,
    city: 'London',
    'checked': false
  }
];

arr1.forEach(a1 => {
  a1.checked = arr2.filter(a2 => a2.city === a1.city)[0].checked
})
console.log(arr1)

Answer 5

1。遍历第一个数组

2。遍历第二个数组

3.when arr1的城市== arr 2的城市

在arr1中保存对arr2的检查

var arr1 = [{
    id: 1,
    city: 'London',
    checked: false
  },
  {
    id: 2,
    city: 'NYC',
    checked: false
  },
  {
    id: 3,
    city: 'Paris',
    checked: false
  },
  {
    id: 4,
    city: 'Madrid',
    checked: false
  }
];


var arr2 = [{
    id: 1,
    city: 'Madrid',
    checked: true
  },
  {
    id: 2,
    city: 'Paris',
    checked: false
  },
  {
    id: 3,
    city: 'NYC',
    checked: true
  },
  {
    id: 4,
    city: 'London',
    checked: false
  }
];

arr1.forEach(function(entry1) {
  arr2.forEach(function(entry2) {
    if (entry1.city == entry2.city) {
      entry1.checked = entry2.checked;
    }

  })
});
console.log(arr1);

Answer 6

使用键值对作为城市名称并从数组2中检查值创建对象。

var array2Obj = {};
for (var i = 0; i < arr2.length; i++) {
    array2Obj[arr2[i].city] = arr2[i].checked;
}

现在循环数组1，并将对象的城市值（即数组2的检查值）分配给数组1的检查值。

for (var i = 0; i < arr1.length; i++) {
    arr1[i].checked = array2Obj[arr1[i].city];
}

Answer 7

使用map和forEach

var arr1 = [{
    city: 'London',
    'checked': false,
    id: 1
  },
  {
    city: 'NYC',
    'checked': false,
    id: 2
  },
  {
    city: 'Paris',
    'checked': false,
    id: 3
  },
  {
    city: 'Madrid',
    'checked': false,
    id: 4
  }
];


var arr2 = [{
    city: 'Madrid',
    'checked': true
  },
  {
    city: 'Paris',
    'checked': false
  },
  {
    city: 'NYC',
    'checked': true
  },
  {
    city: 'London',
    'checked': false
  }
];
var arr3 = arr1.map(e => {
  arr2.forEach(x => x.city == e.city ? e.checked = x.checked : false)
  return e;
})
console.log(arr3)

如何将一个对象数组的一个属性的值分配给另一对象数组的类似命名的属性？ -Javascript

7 个答案:

解释

更新