Question

有没有其他方法可以在对象数组中编写更新项目而不是代码？

const updateTodo = (list, updated) => {
   const index = list.findIndex(item => item.id === update.id)
   return [
   ...list.slice(0,index),
   updated,
   ...list.slice(index+1)
   ]
}

等等，上面的功能是否正常工作？ https://jsbin.com/sifihocija/2/edit?js,console

Answer 1

你这样做是正确的方法。但是它不适合你，因为在你的情况下updated是一个数组而不是一个对象，因此你只需要访问数组第一个元素的id

const updateTodo = (list, updated) => {

   const index = list.findIndex(item => return item.id === updated[0].id)

   return [
   ...list.slice(0,index),
   updated[0],
   ...list.slice(index+1)
   ]
}

<强> JSBIN

但是，我更喜欢库immutability-helper对您可以执行的数据执行任何更新

import update from 'immutability-helper';
const updateTodo = (list, updated) => {
const index = list.findIndex(item => return item.id === updated[0].id)
   return update(list, {
        [index]: {
              $set: updated[0];
        }

   })
}

使用immutabilty-helper的一个优点是，当数据高度嵌套时，它可以提供更多控制

Answer 2

更新（添加/删除）数组的最简单方法是使用splice方法。

它将第一个参数作为索引，第二个作为要删除的元素的no，以及添加的下一个参数。

Answer 3

你做得很多。如果你知道索引，就不需要操纵数组。

const items = [{id: 1, value: 1}, {id: 2, value: 2}, {id: 3, value: 3}];
items[2] = {id: 4, value: 4};
console.log(items); //last element changed

如果您关心没有副作用，请先复制数组

const items = [{id: 1, value: 1}, {id: 2, value: 2}, {id: 3, value: 3}];
const copy = items.slice();
copy[2] = {id: 4, value: 4};
return copy;

使用javascript es6更新对象数组

3 个答案: