Why change player score using new index variable instead of the key which is already defined in players array?

I did not understand that either, I would have just used the id since we are already passing it to the player component. I think this makes for cleaner code since we can do the same thing shown in the video with one less prop.

If you would also like to stop the numbers from being negative, you can do a quick check. if(this.state.players[index].score === 0 && Math.sign(delta) === -1){ return null }

What this is doing is getting the players' score and checking whether or not it is equal to Zero. If it is equivalent to zero, is it being added or subtracted to. If it's being added to the rest of the function will go on; if not, it will returning nothing. The reason I used Math.sign is that, if we decide later we want to add or subtract by 5, it will still work.

HI, I am thinking it has to do with the fact that one of the distinguishing features of an array is that it is accessible by it's index...starting from 0. Your array is an array of objects and you are trying to access the index of objects within the array. By returning the index associated with that prop, you are targeting the score field in the player object at index X. For example, you click the third row (index 2 as it relates to the array).

The player Id's start at 1 while an array's index start at 0. if you where to use the id you would be changing one player below.

Index starts from 0 But the player's id starts from 1. If we use the player id to identify the player, when we need to change the score for player at players[id - 1]

Id or key cannot be used. Let me try to explain with an example.

We have initially got 4 players with id's 1-4, and now with the introduction of the new variable index, index 0-3.

When say the player with id=3 gets deleted, we now have got 3 players, id=1, id=2, id=4. But the index values will be index=0, index=1, index=2. And now if you want to access the last player out of the remaining ones, it should be players[2] and not players[4].

What we need here is an index for the players array to access the array elements. The id or the key is a mere hardcoded number with each of the player objects, which may not necessarily denote the index of the players array, particularly when we have a delete player feature. The index must automatically realign itself on every change of state, and the new index variable exactly does that.