嘗試在 localstorage 中獲取對象的索引，以便我可以使用 javascript 或 jquery 從 localStorage 存儲中刪除/刪除該對象

Question

所有，這是我在這里的第一個問題，所以我希望我的措辭正確並提供了足夠的信息來工作。

我在本地存儲中有一個名為 faveGifs 的密鑰，其中存儲了多個項目，每個項目都是一個對象。 我希望能夠單獨刪除這些對象。 到目前為止，我可以刪除第一個對象，即位置 0 處的對象。我希望能夠在它們所在的任何索引處刪除它們，例如位置 2。 我知道我必須獲得每個對象的索引才能實現這一點，但是，當我通過 indexOf() 運行密鑰時，我獲得的唯一索引是 -1。

這是我的本地存儲密鑰的外觀：

faveGifs[
  {id: 'jijijoj',rating: 'g'}, 
  {id: 'iojiojoi',rating: 'r'}, 
  {id: 'eawfe',rating: 'pg'}, 
  {id: 'ewfewfwe',rating: 'g'}, 
  {id: 'ewfewfew',rating: 'r'}
];

這是我的代碼：

$(document).on("click", "#remove", function () {
  let faveGifs = JSON.parse(localStorage.getItem("faveGifs"));
  let faveGif = faveGifs.map(faveGif => faveGif.id);

  //Neither of the following has worked for me:

  //let index = faveGif.indexOf(faveGif);
  //let index = faveGif.indexOf(faveGifs);
  console.log(index);

  // faveGifs.splice(index, 1);
  // localStorage.setItem("faveGifs", JSON.stringify(faveGifs));
  // populateFaves();
});

我曾嘗試使用類似問題的解決方案，但沒有一個對我有用。 我試過的有：

使用 js 從本地存儲中刪除特定項目

使用js刪除本地存儲中的json對象

如何使用 JavaScript 從數組中刪除對象？

還有其他幾個，但就像我說的，他們都沒有為我工作。

非常感謝幫助我的任何人和每個人。

Answer 1

問題是faveGif仍然是一個數組 - 它看起來像這樣：

faveGif = ['jijijoj', 'iojiojoi', 'eawfe', 'ewfewfwe', 'ewfewfew'];

因此，如果您想查找某個 ID 的索引（例如ewfewfew ）：

let index = faveGif.findIndex(id => id == "ewfewfew");

這將與faveGifs索引相同，因此它將為您提供所需的結果。

示范：

 let faveGifs = [{ id: 'jijijoj', rating: 'g' }, { id: 'iojiojoi', rating: 'r' }, { id: 'eawfe', rating: 'pg' }, { id: 'ewfewfwe', rating: 'g' }, { id: 'ewfewfew', rating: 'r' }]; let faveGif = faveGifs.map(faveGif => faveGif.id); let index = faveGif.findIndex(id => id == "ewfewfew"); console.log(index); //Should return 4

Answer 2

要獲取數組中元素的索引，您可以使用Array.prototype.findIndex()

代碼：

 const data = [ {id: 'jijijoj',rating: 'g'}, {id: 'iojiojoi',rating: 'r'}, {id: 'eawfe',rating: 'pg'}, {id: 'ewfewfwe',rating: 'g'}, {id: 'ewfewfew',rating: 'r'} ]; // get index of element with id `iojiojoi` const index = data.findIndex(item => item.id === 'iojiojoi'); console.log(index);

Answer 3

我相信正在發生的事情是您正在嘗試解析一個字符串，就好像它是 JSON 一樣。

查看這篇文章： 在 HTML5 localStorage 中存儲對象。 OP 正試圖解決類似的問題。