JavaScript本地存储使用localStorage和sessionStorage,以字符串键值对形式保存数据,需用JSON.stringify()存对象、JSON.parse()取对象,并注意null处理、同源限制及容量上限。

JavaScript 操作本地存储主要靠 localStorage 和 sessionStorage,它们都提供简单的键值对存储,数据以字符串形式保存。不需要额外库,浏览器原生支持,但要注意同源限制和容量上限(通常 5–10MB)。
存数据:setItem() 最常用
用 setItem(key, value) 把数据存进 localStorage(长期保存)或 sessionStorage(页面关闭即清空):
value 必须是字符串;存对象或数组要先 JSON.stringify() key 名建议用有意义的英文名,避免特殊字符和空格 示例:localStorage.setItem(‘theme’, ‘dark’);localStorage.setItem(‘user’, JSON.stringify({id: 1, name: ‘Alice’}))
取数据:getItem() 要记得解析
getItem(key) 返回字符串,如果之前存的是对象,得手动 JSON.parse():
如果 key 不存在,返回 null,不是 undefined,判断时注意 示例:const theme = localStorage.getItem(‘theme’) → ‘dark’;const user = JSON.parse(localStorage.getItem(‘user’)) 安全写法:const user = JSON.parse(localStorage.getItem(‘user’) || ‘{}’),避免解析 null 报错
删数据:removeItem() 和 clear() 各有用途
removeItem(key) 删除单个键;clear() 清空整个存储空间(谨慎使用):
立即学习“Java免费学习笔记(深入)”;
删除后再次 getItem(key) 会返回 null sessionStorage.clear() 不会影响 localStorage,反之亦然 适合退出登录时清理用户信息:localStorage.removeItem(‘token’)
其他实用操作:key()、length、遍历
可以查有多少项、获取第 N 个 key,甚至遍历所有数据:
localStorage.length 返回当前键的数量 localStorage.key(0) 获取第一个键名(顺序不保证,仅作参考) 遍历推荐用 for (let key in localStorage),但要加 hasOwnProperty 判断(防原型污染)
基本上就这些。不复杂但容易忽略类型转换和 null 处理,写的时候多留心字符串和 JSON 的来回转换。
以上就是如何用Javascript操作本地存储?的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1542278.html
微信扫一扫
支付宝扫一扫