Question

我有一个对象数组，其中的对象看起来像这样（值改变）：

   {
     stats: {
        hp: 2,
        mp: 0,
        defence: 4,
        agility: 11,
        speed: 6,
        strength: 31
     }
   }

我想按速度降序对它们进行排序：

  array.sort((a, b) => {
            return b.stats.speed - a.stats.speed
        })

但是我遇到此错误，我无法真正理解发生了什么：

TypeError：无法分配为只读对象'[object Array]'的属性'2'

我想念什么？

编辑： Redux存储中的对象数组：

const enemyDefaultState = [
{
    name: 'European Boy1',
    stats: {
        hp: 2,
        mp: 0,
        defence: 4,
        agility: 11,
        speed: 6,
        strength: 31
    }
},
{
    name: 'European Boy2',
    stats: {
        hp: 2,
        mp: 0,
        defence: 4,
        agility: 4,
        speed: 2,
        strength: 31
    }
},
{
    name: 'European Boy3',
    stats: {
        hp: 2,
        mp: 0,
        defence: 4,
        agility: 7,
        speed: 7,
        strength: 31
    }
},

]

我导入数组并将其分配给变量：

 let enemies = getState().enemy;
        if (enemies) {
            //sort by speed stat
            enemies.sort((a, b) => {
                return b.stats.speed - a.stats.speed
            })
        }

Answer 1

由于该数组在frozen中是strict mode，因此您需要先对其进行复制，然后再对其进行排序：

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

Answer 2

Patrick所说的原因是因为阵列被冻结。因此，复制阵列的任何方法都可以像他建议的那样工作。

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

我只想添加原因数组是冻结的，这是因为您将数组用作redux存储中的props和React中的props是不可变的，因此您无法更改数组。

Answer 3

要清楚，问题不仅仅在于阵列被冻结。冻结的数组可以迭代。如ReactJS - sorting - TypeError: 0 is read only中所述，问题在于Array.sort对数组进行原位排序，这意味着它试图使数组发生突变。这就是为什么您需要向其传递数组的可变副本。

Answer 4

冻结阵列以防止redux状态突变。您使用react cloneElement（）： https://reactjs.org/docs/react-api.html#cloneelement

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

对对象数组进行排序时出错无法分配给对象“ [对象数组]”的只读属性“ 2”

4 个答案: