替换对象数组中属性的最佳方法答案

【问题标题】：Best way to replace a property in an array of objects替换对象数组中属性的最佳方法
【发布时间】：2021-09-20 06:56:12
【问题描述】：

const organisations = {
  fetchingData : false ,
  error : null,
  data : {
    totalCount : 68,
    data : [
     { indID : 12345, name : 'abc'},
     { indID: 12, name : 'xyz'}]
  }
}

const checkedBy = {
  data : {
    name : 'PQ',
  },
  indID : 12345,
}

当indID与organisations对象的数据数组的数组匹配时，我想用checkedBy对象的name属性替换organisations对象中的name属性

【问题讨论】：

请分享你尝试了什么？

标签： javascript reactjs

【解决方案1】：

我想这就是你想要的映射器功能？

let org = {
  fetchingData : false ,
  error : null,
  data : {
    totalCount : 68,
    data : [
     { indID : 12345, name : 'abc'},
     { indID: 12, name : 'xyz'}]
  }
}

const checkedBy = {
  data : {
    name : 'PQ',
  },
  indID : 12345,
}

console.log("Before :: \n", org)

org.data.data = org.data.data.map(x => {
 if(x.indID === checkedBy.indID){
    x.name = checkedBy.data.name
  }
return x;
})


console.log("After :: \n", org);

【讨论】：

【解决方案2】：

您可以使用find轻松实现结果

const organisations = {
  fetchingData: false,
  error: null,
  data: {
    totalCount: 68,
    data: [
      { indID: 12345, name: "abc" },
      { indID: 12, name: "xyz" },
    ],
  },
};

const checkedBy = {
  data: {
    name: "PQ",
  },
  indID: 12345,
};

const obj = organisations.data.data.find((o) => o.indID === checkedBy.indID);
obj.name = checkedBy.data.name;
console.log(organisations);

/* This is not a part of answer. It is just to give the output fill height. So IGNORE IT */
.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：

【解决方案3】：

您可以通过以下方式改变organisations.data.data。

const organisations = {
  fetchingData: false,
  error: null,
  data: {
    totalCount: 68,
    data: [{
        indID: 12345,
        name: 'abc'
      },
      {
        indID: 12,
        name: 'xyz'
      }
    ]
  }
}

const checkedBy = {
  data: {
    name: 'PQ',
  },
  indID: 12345,
}

//replace name
organisations.data.data = organisations.data.data.map(org => {

  if (org.indID === checkedBy.indID) {
    return {
      ...org,
      // replace name with checked by name
      name: checkedBy.data.name
    }
  }

  return org

})

console.log(organisations.data.data)

【讨论】：

【解决方案4】：

从organizations 对象中查找节点并更新节点（如果找到）。

const organisations = {
  fetchingData: false,
  error: null,
  data: {
    totalCount: 68,
    data: [
      { indID: 12345, name: 'abc' },
      { indID: 12, name: 'xyz' }]
  }
}
const checkedBy = { data: { name: 'PQ' }, indID: 12345 }
const updateNode = organisations.data.data.find(node => node.indID === checkedBy.indID);
updateNode ? updateNode.name = checkedBy.data.name : {};
console.log(organisations);

【讨论】：