Javascript 更新数组中对象的更干净方法

我有一个如下格式的对象数组：

{
  "_id": "590cbcd9bf2b9b18ab3c3112",
  "title": "",
  "content": "Create Notes Webapp",
  "checked": true,
  "listID": "590cbc61bf2b9b18ab3c3110"
},
{
  "_id": "590cfe5a86fe0908c560c2b0",
  "title": "A Note 01",
  "content": "My first note.",
  "checked": false,
  "listID": "590cbe15bf2b9b18ab3c3114"
}

onChange={(e, value) => this.onTextChange('title', note, value)}

以下是我必须更新每个项目的代码：

  onTextChange = (key, note, value) => {
    clearTimeout(timeoutID);
    switch (key) {
      default:
        break;
      case 'title':
        note.title = value;
        break;
      case 'checked':
        note.checked = value;
        break;
      case 'content':
        note.content = value;
        break;
    }
    var notes = this.state.notes;
    var id;
    for (var i in notes) {
      if (notes[i]._id === note._id) {
        notes[i] = note;
        id = i;
        break;
      }
    }
    this.setState({ notes }, () => { timeoutID = setTimeout(() => this.updateNote(this.state.notes[id]), 3000); });

  }

这叫做：

{
  "_id": "590cbcd9bf2b9b18ab3c3112",
  "title": "",
  "content": "Create Notes Webapp",
  "checked": true,
  "listID": "590cbc61bf2b9b18ab3c3110"
},
{
  "_id": "590cfe5a86fe0908c560c2b0",
  "title": "A Note 01",
  "content": "My first note.",
  "checked": false,
  "listID": "590cbe15bf2b9b18ab3c3114"
}

onChange={(e, value) => this.onTextChange('title', note, value)}

---

有没有比使用switch语句更新对象中的指定项更好的方法？此外，是否有一种比for循环更简单的方法来扫描数组中的id？

是否有比使用该switch语句更新对象中的指定项更好的方法

可以使用此语法更新note对象。这也确保它不会在注释中插入新属性

if (note.hasOwnProperty(key) {
  note[key] = value
}

对于更新注释的更清晰语法，您可以这样做

var newNotes = this.state.notes.map(n => n._id === note._id ? note : n);
this.setState({notes: newNotes});

这将创建一个与当前状态相同的newNotes数组，只是它将替换传入的。\u id等于数组中的id的数组

---

您还必须调整updateNote调用，因为您不再保存索引，但可能只使用Notes变量而不是switch。您可以这样做，但必须检查对象中是否存在该变量

 onTextChange = (key, note, value) => {
clearTimeout(timeoutID);
if(note[key]){
    note[key] = value;
}
var notes = this.state.notes;
var id;

}

至于循环，它是像airbnb和谷歌这样的大多数标准的首选。 如果您想要更好的方法，您可以根据情况和使用es5、es6对该对象阵列执行多项操作，但您可以选择： 1.使对象数组成为一个对象，其键（属性名）为您的id（它们可以是任何字符串）。 2.如果使用es6，您可以将其转换为地图，这样可以更轻、更快地获取所需的对象

---

希望这会有所帮助。

正如noveyak所说，您可以使用括号语法访问Javascript中的属性，其中键是一个包含属性名称的字符串（现在就是这样）

Javascript有几种不同的访问对象属性的方法：

note[key] = value;

// if key is 'title', it will be the same as:
note.title = value;

// also the same as:
note['title'] = value;

对于第二个问题，您可以将这些对象存储在另一个对象中，id作为属性值（基本上将其用作映射），而不是在数组上循环。通过这种方式，您可以通过id直接访问注释条目。例如：

allNotes = {}; // create a new object
someNotes = {
 'title': '',
 'content': 'Create Notes Webapp',
 'checked': true,
 'listID': '590cbc61bf2b9b18ab3c3110'
};
allNotes[idOfNote] = someNote; // where idOfNote holds the actual id of the note as a string

您可以在Mozilla的参考网站上阅读有关Javascript属性访问器的更多信息

---

Javascript还可以使用适当的映射来代替对象，如果允许使用ES2015，这样会更安全、更快。您可以了解它（还有Mozilla文档）。

或

if（输入注释）

。为什么要使用settimeout？如果您想在setState完成后运行代码，请执行以下操作：

setState（{notes}，（）=>{//your code}

）事实上这一点很好。我忘了我应该在setState回调上设置计时器