JS匹配两个对象数组ID 复制对应visible属性值实现方法

核心逻辑非常直接：逐个匹配两个数组中table.id相同的对象，把拷贝数组对应项的visible值赋值给原始数组对应项即可。

基础实现（适合新手理解，适配绝大多数业务场景） #

直接用你已经用过的数组方法就能实现，没有额外学习成本：

// 遍历原始数组的每一列
selectedCols.forEach(originalCol => {
  // 在拷贝数组中查找table.id完全一致的项
  const matchedCol = copyOfSelectedColsObj.find(copyCol => {
    return copyCol.table.id === originalCol.table.id
  })
  // 加判断避免极端场景下（比如拷贝数组缺项）读取空值报错
  if (matchedCol) {
    originalCol.visible = matchedCol.visible
  }
})

涉及的基础方法说明：

• forEach：你之前修改拷贝数组visible属性时已经用过，作用是按顺序遍历数组每一项，没有返回值
• find：数组内置查找方法，会返回第一个符合匹配规则的数组元素，找不到时返回undefined

注意：JS中对象是引用类型，这里直接修改originalCol的属性，原始selectedCols数组就会同步更新，不需要额外做数组重新赋值操作。

大数据量优化写法 #

如果两个数组长度超过千条，每次遍历查找会有性能损耗，可以先把拷贝数组转成id映射表，把查找时间复杂度从O(n)降到O(1)：

// 先构建id和拷贝对象的映射关系
const colMap = new Map()
copyOfSelectedColsObj.forEach(copyCol => {
  colMap.set(copyCol.table.id, copyCol)
})

// 遍历原始数组直接通过id取对应项赋值
selectedCols.forEach(originalCol => {
  const matchedCol = colMap.get(originalCol.table.id)
  if (matchedCol) {
    originalCol.visible = matchedCol.visible
  }
})

额外语法提示 #

你贴出的原始数组定义存在语法错误，对象属性之间缺少分隔逗号，直接运行会报错，修正后的写法如下：

let selectedCols = 
[
 {
  "table" :
     { 
      "id" : "bafc1af7-e2c5-ec11-a7b6-00224818a168",
      "name" : "test1"
     },
  visible : true,
  trueCol : 1
},
{
 "table" :
     { 
      "id" : "cdep1af7-e4c5-ec11-a7b6-00224818a198",
      "name" : "test2"
     },
  visible : true,
  trueCol : 2
}
]

内容的提问来源于stack exchange，提问作者MVC_Nhibernate