Javascript 在react reducer中处理数组对象最有效的方法是什么？

我正在使用react reducer，遇到了一个场景，希望知道更好的处理方法。 我有一个对象列表数组，我想在reducer中修改列表中的一个对象。按照标准，我们不应该改变国家。 我举了以下例子：

const state =
{
  items : [
    {
      'id': 1,
      'name': 'test1',
      'price': 10,
      'work': {
        'work1': 1
      }
    },
    {
      'id': 2,
      'name': 'test2',
      price: 20
    },
    {
      'id': 3,
      'name': 'test3',
      price: 30
    }
  ]
};
// here I would like to find item with id = 1 and modify that object with price = 40 and add new property into nested work property.
const test = state.items.map(item => {
  if (item.id ===1) {
    let newItem = {...item};
    newItem['price'] = 40;
    newItem['work'] = {...newItem['work'], 'work2': 2}
    return newItem;
  }
  return item;
})

我检查了原始状态对象和计算后的新对象，发现状态对象没有发生变化。 我想知道，这是使用带有reducer的对象列表数组的正确方法，还是有其他标准方法可以做到这一点

---

我想提前表示感谢。

您的方法是正确的，因为您在对该对象进行更改之前创建了该对象的副本。但是，使用ES6，您可以进一步进行分解，使其更干净。我会以以下方式处理：

const test = state.items.map(item =>
    item.id === 1
        ? ({
            ...item,
            price = 40,
            work: {
              ...item.work,
              work2: 2
            }
        })
        : item
)

---

这是状态不会更改的预期行为，因为当您使用

Array.map

时，它会复制每个元素，而不是进行引用，因此初始对象在映射后不会更改，并且您必须：

const newItems = state.items.map(item => {
  if (item.id ===1) {
    let newItem = {...item};
    newItem['price'] = 40;
    newItem['work'] = {...newItem['work'], 'work2': 2}
    return newItem;
  }
  return item;
})
this.setState({items: newItems })