使用Javascript限制json localstorage中的重复项
我浏览了一些链接,但这对我没有帮助。我必须限制json数组中重复的标题。在这里怎么办使用Javascript限制json localstorage中的重复项,javascript,jquery,arrays,json,Javascript,Jquery,Arrays,Json,我浏览了一些链接,但这对我没有帮助。我必须限制json数组中重复的标题。在这里怎么办 function submitForm(){ var titleInput=document.getElementById('titleName').value; var messageInput=document.getElementById('titleDesc').value; var oldItems = JSON.parse(localStorage.getItem('itemsArr
function submitForm(){
var titleInput=document.getElementById('titleName').value;
var messageInput=document.getElementById('titleDesc').value;
var oldItems = JSON.parse(localStorage.getItem('itemsArray')) || [];
var newItem = {
"title":titleInput ,
"desc": messageInput
};
if(!(titleInput=="" || messageInput=="")){
oldItems.push(newItem);
}
}
试试这个:
if (!(titleInput == "" || messageInput == "")) {
var repeated = false;
for (var i = 0; i < oldItems.length; i++) {
if (oldItems[i].titleInput == titleInput) {
repeated = true;
break;
}
}
if (repeated == false) {
oldItems.push(newItem);
}
}
您只需在添加项目之前检查项目是否存在
var alreadyExists = oldItems.some(function (item) { return item.title == titleInput; });
if(!(titleInput=="" || messageInput=="") && !alreadyExists) {
oldItems.push(newItem);
}
然后,也许您应该通过将该逻辑封装在ItemStore或类似的东西中,使概念更加明确
function ItemStore(items) {
this._items = [];
this._titleMap = {};
this.addAll(items || []);
}
ItemStore.prototype = {
constructor: ItemStore,
hasItemTitled: function (title) {
return !!this._titleMap[title];
},
add: function (item) {
var title = item.title;
if (this.hasItemTitled(title)) throw new Error("the store already contains an item titled '" + title + "'");
this._titleMap[title] = true;
this._items.push(item);
},
addAll: function (items) {
items.forEach(this.add.bind(this));
},
items: function () { return this._items.slice(); }
//other useful methods such as itemAt, remove...
};
然后你的代码就变得像
var titleInput=document.getElementById('titleName').value;
var messageInput=document.getElementById('titleDesc').value;
var oldItems = new ItemStore(JSON.parse(localStorage.getItem('itemsArray')) || []);
var newItem = {
"title":titleInput ,
"desc": messageInput
};
var shouldAddItem = titleInput != "" && messageInput !="" && !oldItems.hasItemTitled(newItem.title);
if (shouldAddItem) oldItems.add(newItem);
现在很明显,您的函数仍然做得太多,因为它:
知道如何从用户的输入检索和创建新项
知道如何使物品商店重新水化
知道如何检查以验证项目是否有效,是否应添加
您应该阅读有关的内容,它不仅适用于OO