使用Javascript限制json localstorage中的重复项

使用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

我浏览了一些链接,但这对我没有帮助。我必须限制json数组中重复的标题。在这里怎么办

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