使用Javascript - 更清洁的方式在阵列

更新对象我有此格式对象的数组：使用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" 
}

这里是我必须更新每个项目代码：

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); }); 

    }

这就是所谓的像这样：

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

难道还有比使用switch语句更好的方法来更新指定的项目物体？此外，是否有一个简单的方法扫描数组的id比for循环？

来源

2017-05-05 Timmo

你为什么使用settimeout？如果你想在setState完成后运行代码，可以这样做：'setState（{notes}，（）=> {//你的代码}'） – kurumkan

实际上好点。我忘了我应该在setState回调 – Timmo

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

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

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阵列它等同于目前的状态，除了它会取代一个地方传递在._id是等于数组中的那个。

您还需要调整updateNote调用，因为您不再保存索引，但可以只使用note变量？

来源

2017-05-05 23:05:37 noveyak

或'if（key in note）'上设置定时器。 – trincot

而不是开关，你可以做到这一点，但你必须检查它是否存在于对象中。

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

}

至于循环它是由大多数标准等的Airbnb和谷歌优选的。如果你想要更好的方式，你可以根据具体情况用对象数组做几件事情，如果你使用es5，es6，但是你的选项是： 1.使用key（property名称）是你的ID（他们可以是任何字符串）。 2.如果使用es6，你可以转换成地图，它使得它更轻，更快获得需要的对象。

希望有帮助。

来源

2017-05-05 23:38:59

就像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的参考网站here JavaScript属性访问器。

Javascript也有适当的地图，您可以使用，而不是一个对象，如果您被允许使用ES2015更安全，更快。您可以了解它here（也是Mozilla文档）。

来源

2017-05-05 23:56:46

使用Javascript - 更清洁的方式在阵列

回答

相关问题