Javascript：從存儲在localStorage中的數組中刪除對象？

Question

我存儲在localStorage的一個數組，看起來像這樣：

[ 
    { 
    "location": "westcliff, uk", 
    "stopover": true 
    }, 
    { 
    "location": "westcliff, uk", 
    "stopover": true 
    }, 
    { 
    "location": "southend, uk", 
    "stopover": true 
    }, 
    { 
    "location": "Leigh-on-sea, uk", 
    "stopover": true 
    } 
] 

我有一個按鈕，當我點擊，它會尋找localtion:數組中，它會從陣列中刪除該對象和然後再次存儲在本地存儲中。

按鈕的代碼如下所示：

$(document).on('click', ".cart-del", function() { 
    var retrievedObject2 = localStorage.getItem('waypoints'); 
    var parsedObject2 = JSON.parse(retrievedObject2); 
    var result2 = parsedObject2.filter(function(x){return x.location !== "westcliff, uk"; }); 
    var setLoc2 = JSON.stringify(result2); 
    localStorage.setItem('waypoints', setLoc2); 
}): 

這一切工作正常。

，我有是單擊按鈕時，它會刪除所有「westcliff, uk」對象的問題。

什麼，我需要做的是隻爲每次點擊刪除1個對象！

可能有人請就這個問題諮詢？

在此先感謝。

編輯：

我嘗試這樣做，這不會從數組中刪除任何東西：

$(document).on('click', ".cart-del", function() { 

    var retrievedObject2 = localStorage.getItem('waypoints'); 
    var parsedObject2 = JSON.parse(retrievedObject2); 

    for(var i = 0; i < parsedObject2.length; i++){ 
    if(parsedObject2[i].text == "westcliff, uk"){ 
    parsedObject2.splice(i, 1); 
    break; 
    } 
    } 



    var result2 = parsedObject2;  

    var setLoc2 = JSON.stringify(result2); 
    localStorage.setItem('waypoints', setLoc2); 
    }): 

Answer 1

這是由於您使用的是filter，因此無法及早退出，因此可能不適合此用例。相反，您可以使用常規循環。這是一個例子。

var a = [ 
 
    {text : "foo", n : 1 }, 
 
    {text : "foo", n : 2 } 
 
]; 
 
for(var i = 0; i < a.length; i++){ 
 
    if(a[i].text == "foo"){ 
 
    a.splice(i, 1); 
 
    break; 
 
    } 
 
} 
 
console.log(a);

或者使用findIndex了一個更簡潔的方法：

var a = [ 
 
    {text : "foo", n : 1 }, 
 
    {text : "foo", n : 2 } 
 
]; 
 

 
a.findIndex((obj, i) => { 
 
    if(obj.text === "foo"){ 
 
    a.splice(i,1); 
 
    return true; 
 
    } 
 
}); 
 

 
console.log(a);

Answer 2

您可以使用find方法而不是過濾方法

parsedObject2.find(function(x,e){ 
    if(x.location == "westcliff, uk") 
    { 
     return x.splice(e,1) 
    } 
});