There is a bug in my array's adding/updating function. May I know why is that?

Question

I have a array of object.

The structure of object is as below, having two keys: one is name, the other is a

{name:'set1',a:1}

Below is my programming to handle an add object function into it;

let totalData = [] 

console.log(totalData)

handleUpdateTotalData = (updateJson) => {
  let duplicate = false;
  tmpTotalData = TotalData.map((element,index) => {
    if( element.name === updateJson.name ){
      duplicate = true
      return updateJson
    }
    return element
  })
  return duplicate? tmpTotalData: (totalData = [...totalData,updateJson])

}

handleUpdateTotalData({name:'set1',a:1})

console.log(totalData)

handleUpdateTotalData({name:'set1', a:2}) //since probety name:'set1' has occured, so it should update the previous object instead of adding a new one

console.log(totalData)
//expected to show {name:'set1', a:2}
//But now it show{name:'set1', a:1}

Q1: In my program, the expected outcome is not as my expected, May I ask why is that?

Important note on how you're naming things: you're not working with JSON, you're working with normal JS objects. Definitely don't call a variable "json" unless it really is just a string that you can't do anything with until you JSON.parse it. Your `updateJson` should really just be `data`. Also, variables (and functions) in JS use the lowerCamelCase convention, only classes use UpperCamelCase. Which is important to follow if you want others to read (let alone help with =) your code. — Mike 'Pomax' Kamermans, Aug 26 '22 at 15:43
Mostly "this code makes very little sense": there is zero reason for this function to do anything other than update an element in `totalData`: in this case you probably want to use `findIndex` to see if you already have an object with the same name, and if so, update it with the passed in data, and if not, push the passed in data onto the array. Then you're done, you're using a global array so there's no reason to return anything. `const pos = list.findIndex(v => v.name===data.name);` and then just go "if pos > -1 do the thing, else do the other thing". — Mike 'Pomax' Kamermans, Aug 26 '22 at 15:54
The question was classified as duplicated, nevertheless: `const TotalData = []; const handleUpdateTotalData = (updateJson) => { const itemIndex = TotalData.findIndex(item => item.name == updateJson.name); if (itemIndex < 0) { TotalData.push(updateJson); } else { TotalData[itemIndex] = updateJson; } }` — Pedro Amaral Couto, Aug 26 '22 at 15:56
@PedroAmaralCouto if you're going to post an entire program in a comment, that's an answer, not a comment. If you want to leave an answer on a closed post, vote to reopen it. — Mike 'Pomax' Kamermans, Aug 26 '22 at 15:56
Yea, vote it to reopen, otherwise I cant give you the internet point. But thanks first — Ae Leung, Aug 26 '22 at 15:58
@Mike'Pomax'Kamermans, I know it's an "answer". I'm presuming most probably it won't be reopened. It seems @AeLeung is novice and doesn't understand what is `map`. Even if the question was opened, at least I sent something. It's not for reputation. — Pedro Amaral Couto, Aug 26 '22 at 16:05
@Mike'Pomax'Kamermans , may I ask, when you say "here is zero reason for this function to do anything other than update an element in totalData" , what do you mean? coz there may be case that I need to append element instead of update a element. Let me know if I misunderstand — Ae Leung, Aug 26 '22 at 16:08
@PedroAmaralCouto I dont quite know how the reopen system works, So anyway, I also upvote your comment, coz it helps as well — Ae Leung, Aug 26 '22 at 16:09
@PedroAmaralCouto I know .map , but .map seems to be not as efficiency as .find index here? Let me know it actually it is more helpful — Ae Leung, Aug 26 '22 at 16:10
@Ae Leung, there's `TotalData.map` in that code. You're not trying to map values. You're trying to find an element that follows a certain condition and replace it, or add it, accordingly. With `findIndex`, you can get the index of the element that follows the condition `element.name === updateJson.name` and use it to replace it. Like this: `TotalData[itemIndex] = updateJson;`. Otherwise, if it was not found, `findIndex` returns `-1`, and you do something like `TotalData.push(updateJson);`. I didn't remember the name of the method. I searched for "javascript find index array". — Pedro Amaral Couto, Aug 26 '22 at 16:15
@PedroAmaralCouto You're trying to find an element that follows a certain condition and replace it, or add it, accordingly. Yes, exactly, why is this a problem ? — Ae Leung, Aug 26 '22 at 16:18
I mean , I understand you code, but why using map here is wrong and this is the reason casuing the bug? — Ae Leung, Aug 26 '22 at 16:20
ok, i guess , by map, it means I have to do sth with the element. So, even though it's not wrong to do what I was doing, it may seem to not quite correct to use it in this way. Is that what you mean? @PedroAmaralCouto — Ae Leung, Aug 26 '22 at 16:41
@Ae Leung, when you use a function, supposedly you're saying what you're trying to do. In this case, you want to check if something already exists. You also have several other things besides `map`. Besides: you're not changing the array when there's a "duplicate". You're just returning `tmpTotalData` when there's a "duplicate". What happens if you have `duplicate? (totalData = tmpTotalData) : (totalData = [...totalData,updateJson])` instead? — Pedro Amaral Couto, Aug 26 '22 at 17:08
@PedroAmaralCouto , I guess I understand what message you are trying to convey. I havent thought about this aspect before Thanks , I learnt sth. Sorry for late reply tho, coz my english is not that good, so I took up sometimes to eventually understand what you meant last time — Ae Leung, Aug 30 '22 at 17:41
No problem. Essentially, it is not working, because `totalData` was not updated when `duplicate` is true. It works when `duplicated` is false, because you have that `totalData =`. — Pedro Amaral Couto, Aug 30 '22 at 22:38

There is a bug in my array's adding/updating function. May I know why is that?

0 Answers0