news 2026/9/26 0:10:58

localStorage

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
localStorage

一、localStorage 是什么

  • 浏览器本地存储

  • 永久保存(不主动删就一直在)

  • 只能存字符串

  • 同一域名下共享


二、四个核心 API

1️⃣ 保存数据

localStorage.setItem(key, value);

2️⃣ 读取数据

localStorage.getItem(key);

3️⃣ 删除某一项

localStorage.removeItem(key);

4️⃣ 清空所有

localStorage.clear();

三、存对象 / 数组(重点)

localStorage 只能存字符串

存之前:JSON.stringify

localStorage.setItem('config', JSON.stringify(obj));

取出来:JSON.parse

const obj = JSON.parse(localStorage.getItem('config'));


四、常见使用场景

  • 用户配置(主题、语言、布局)

  • 登录信息(token、用户信息)

  • 页面状态缓存


五、通用封装写法

// 存 function setStorage(key, value) { localStorage.setItem(key, JSON.stringify(value)); } // 取 function getStorage(key) { const data = localStorage.getItem(key); return data ? JSON.parse(data) : null; } // 删 function removeStorage(key) { localStorage.removeItem(key); }
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!