Error while sorting array of objects Cannot assign to read only property '2' of object '[object Array]'

Question

I\'m having array of objects where object looks like this (values change):

   {
     stats: {
        hp: 2,
        mp: 0,
        defence: 4,
        agili         


        

Answer 1

Because the array is frozen in strict mode, you'll need to copy the array before sorting it:

array = array.slice().sort((a, b) => b.stats.speed - a.stats.speed)

Answer 2

To be clear, the issue is not purely that the array is frozen. Frozen arrays can be iterated over. As noted in ReactJS - sorting - TypeError: 0 is read only, the issue is that Array.sort sorts the array in-place, meaning it attempts to mutate the array. That's why you need to pass it a mutable copy of the array.

Answer 3

The reason as Patrick stated is because the array is frozen. So any method of copying the array will work such as the one he suggests.

array = array.slice().sort((a, b) => b.stats.speed - a.stats.speed)

I just want to add that the reason the array is frozen in your case is because your using the array as props from the redux store and props in React are immutable hence your not being able to mutate the array.

Answer 4

The array is frozen to prevent mutation of the redux state. You use react cloneElement(): https://reactjs.org/docs/react-api.html#cloneelement

[...enemies].sort((a, b) => {
                return b.stats.speed - a.stats.speed
            })