更新数组内对象的属性

Question

单击按钮后，fruitData 数组中的数据将添加到另一个名为“history”的数组中。我希望每当属性“kultivar”、“blokNommer”和“year”与从fruitData 添加的对象匹配时，历史记录中的属性“bins”就会更新。（如果有匹配，则 bins 属性内的数字需要相加）例如这个：[{datum: "2020-04-08", kultivar: "bc", ha: "5", blokNommer: "1", bins: "20", year: "2020"}, {datum: "2020-04-08", kultivar: "bc", ha: "5", blokNommer: "1", bins: "20", year: "2020"}]应等于此（垃圾箱：40）：[ {datum: "2020-04-08", kultivar: "bc", ha: "5", blokNommer: "1", bins: "40", year: "2020"}]我的代码：let fruitData = [{    datum: "2020-04-08",    kultivar: "bc",    ha: "5",    blokNommer: "1",    bins: "20",    year: "2020"  },  {    datum: "2020-09-18",    kultivar: "wb",    ha: "5",    blokNommer: "1",    bins: "5",    year: "2020"  },  {    datum: "2020-03-09",    kultivar: "bc",    ha: "5",    blokNommer: "1",    bins: "20",    year: "2020"  },  {    datum: "2020-04-08",    kultivar: "bc",    ha: "5",    blokNommer: "1",    bins: "20",    year: "2020"  }]historyButton.addEventListener('click', () => {  addToHistory(fruitData)})function addToHistory(elements) {  for (let elem in elements) {    history = [...history, elements[elem]];  }  sortHistory()}function sortHistory() {  let newHistory = [];  history.forEach(function(item, index) {    if (newHistory.length === 0) {      newHistory.push(item)    } else {      newHistory.forEach(function(itm, idx) {        if (item.year === itm.year && item.kultivar === itm.kultivar && item.blokNommer ===          itm.blokNommer) {          item.bins = item.bins + itm.bins        } else {          newHistory.push(item)        }      })    }  })  console.log(newHistory)}这没有给出我正在寻找的输出。也尝试过减少方法但没有运气。将不胜感激任何帮助！

Answer 1

您需要迭代原始数组，并使用检索数组中与 , 匹配的find()现有项目，以便访问和更新它。historykultivarblokNommeryearbins

注意：在示例中将binsby转换为其字符串也很重要，然后将其转换回.Number()string

const arr = [

{datum: "2020-04-08", kultivar: "bc", ha: "5", blokNommer: "1", bins: "20", year: "2020"}, 

{datum: "2020-09-18", kultivar: "wb", ha: "5", blokNommer: "1", bins: "5", year: "2020"}, 

{datum: "2020-03-09", kultivar: "bc", ha: "5", blokNommer: "1", bins: "20", year: "2020"}, 

{datum: "2020-04-08", kultivar: "bc", ha: "5", blokNommer: "1", bins: "20", year: "2020"}

]

const history = [];

arr.forEach(item => {

  const found = history.find(({ kultivar, blokNommer, year }) => 

    kultivar === item.kultivar && blokNommer === item.blokNommer && year === item.year)

  

  if(found) {

    found.bins = (Number(found.bins) + Number(item.bins)).toString();

  } else {

    history.push(item);

  }

});

console.log(history);

Answer 2

如果您的fruitData数组不是很大，您可以尝试使用迭代元素并搜索indexOf整个数组，将其转换为字符串JSON.stringify

但如果数组很大，则代码不是最佳的

const fruitData = [

  {datum: "2020-04-08", kultivar: "bc", ha: "5", blokNommer: "1", bins: "20", year: "2020"}, 

  {datum: "2020-09-18", kultivar: "wb", ha: "5", blokNommer: "1", bins: "5", year: "2020"}, 

  {datum: "2020-03-09", kultivar: "bc", ha: "5", blokNommer: "1", bins: "20", year: "2020"}, 

  {datum: "2020-04-08", kultivar: "bc", ha: "5", blokNommer: "1", bins: "20", year: "2020"}]

  

const sortHistory = (myArray) => Object.keys(myArray).reduce((accum, item) => {

  const currItem = JSON.stringify(myArray[item])

  const allArr = JSON.stringify(accum)

  return (allArr.indexOf(currItem) >= 0) ? accum : accum.concat(myArray[item])

}, [])   

console.log(sortHistory(fruitData))

Answer 3

您的实施的问题是您正在更改itm.bins. Array.forEach 在遍历每个元素时创建每个元素的副本，因此您更改的任何值都itm不会反映在实际数组中。idx因此，如果您想更改实际元素，则会向您提供。

另外，您用于+添加字符串，而不是整数。您需要先将其转换为整数才能获得所需的结果。

最终代码应该是：

function sortHistory(){

        let newHistory = [];

        history.forEach(function(item, index){

            if(newHistory.length === 0){

                newHistory.push(item)

            } else{

                newHistory.forEach(function(itm, idx){

                    if(item.year === itm.year && item.kultivar === itm.kultivar && item.blokNommer === 

                       itm.blokNommer){

                        newHistory[idx].bins = parseInt(item.bins) + parseInt(itm.bins);

                    }else{

                        newHistory.push(item)

                    }

                })

            }

        })

        console.log(newHistory);

history = newHistory;}