JS中的localStorage怎么用？能存什么？

localstorage 是 JS 中用于持久化存儲字符串數據的工具，即使頁面刷新或瀏覽器關閉也不會丟失。它僅支持字符串類型，存儲對象或數組時需先用 json.stringify() 轉換，讀取時用 json.parse() 還原。1. 存數據用 setitem(key, value)；2. 取數據用 getitem(key)；3. 刪數據用 removeitem(key)；4. 清空用 clear()；5. 查看 key 用 key(index)。適合存用戶偏好、靜態緩存等非敏感信息，不適合頻繁修改或敏感數據。使用時需注意：必須手動轉換數據類型、避免超限、不可跨域共享、頻繁讀寫影響性能，建議結合默認值處理以提高健壯性。

localStorage 是 JS 里用來做本地存儲的一個工具，簡單又實用。它能存字符串數據，即使頁面刷新或者瀏覽器關閉了，數據也不會丟。關鍵在于怎么用對地方，別亂用。

localStorage 能存什么？

localStorage 只支持字符串類型的數據。如果你要存對象、數組、數字這些，得先轉成字符串。最常用的方法就是 JSON.stringify()。

比如：

const user = { name: "Tom", age: 25 }; localStorage.setItem("user", JSON.stringify(user));

反過來取的時候要用 JSON.parse() 把字符串還原回來：

const storedUser = JSON.parse(localStorage.getItem("user"));

別想著存函數或者 undefined，那些會被忽略或者出錯。

基本操作：增刪改查

localStorage 的 API 很簡單，就幾個方法：

• 存數據：localStorage.setItem(key, value)
• 取數據：localStorage.getItem(key)
• 刪數據：localStorage.removeItem(key)
• 清空所有：localStorage.clear()
• 查看 key：localStorage.key(index)（用于遍歷）

舉個例子：

localStorage.setItem("theme", "dark"); console.log(localStorage.getItem("theme")); // 輸出 "dark" localStorage.removeItem("theme");

注意：雖然操作起來像對象賦值一樣方便，但它是同步的，不能異步操作，大數據量可能會卡界面。

什么時候適合用 localStorage？

• 需要持久化保存用戶偏好，比如主題、語言設置。
• 存 Token 或登錄狀態信息（不過要注意安全問題）。
• 做緩存，減少重復請求，比如一些靜態配置數據。
• 不適合頻繁變動的數據，也不適合敏感信息（因為是明文存儲）。

如果只是臨時用一下，可以用 sessionstorage，關掉標簽頁就自動清了。

使用時容易踩的坑

• 忘記轉字符串：直接塞對象進去會變成 [Object Object]。
• 超過容量限制：主流瀏覽器一般是 5MB 左右，超了會報錯。
• 跨域不共享：不同域名下的 localStorage 是隔離的，子域名也不行。
• 讀寫頻繁影響性能：特別是循環里面頻繁 setItem，盡量合并操作。

建議在存之前判斷是否存在，取值之后也最好做下默認值處理：

const theme = localStorage.getItem("theme") || "default";

基本上就這些。localStorage 用起來不難，但要注意場景和規范，別濫用就行。