首頁 > web前端 > js教程 > 如何在 localStorage 中儲存和檢索 JavaScript 陣列?

如何在 localStorage 中儲存和檢索 JavaScript 陣列?

Barbara Streisand
發布: 2024-12-09 17:13:15
原創
345 人瀏覽過

How Can I Store and Retrieve JavaScript Arrays in localStorage?

localStorage:數組儲存困境

使用 localStorage 儲存變數時,注意其局限性至關重要。與常規 JavaScript 不同,localStorage 只能處理字串。當嘗試儲存數組等複雜資料結構時,這提出了挑戰。

在原始程式碼中,您嘗試將陣列直接指派給 localStorage。但是,這種方法將會失敗,因為 localStorage 需要一個字串值。要解決這個問題,我們需要將數組轉換為字串。

JSON 來救援

JSON(JavaScript 物件表示法)是一種資料交換格式,讓我們可以將物件和陣列表示為字串。透過使用 JSON.stringify(),我們可以將名稱陣列轉換為 JSON 字串。

var names = [];
names[0] = prompt("New member name?");
localStorage.setItem("names", JSON.stringify(names));
登入後複製

此程式碼將成功將名稱陣列作為字串儲存在 localStorage 中。

擷取並使用

從localStorage擷取陣列時,我們需要轉換儲存的JSON字串使用 JSON.parse() 返回陣列。

var storedNames = JSON.parse(localStorage.getItem("names"));
登入後複製

現在,storedNames 將包含儲存在 localStorage 中的原始陣列。

或者,您也可以使用直接屬性存取設定和擷取JSON 字串,繞過setItem() 和getItem() 方法:

localStorage.names = JSON.stringify(names);
var storedNames = JSON.parse(localStorage.names);
登入後複製

此方法提供了更多簡潔的語法,但需要注意的是,舊版瀏覽器可能不支援它。

以上是如何在 localStorage 中儲存和檢索 JavaScript 陣列?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板