存储和读取数据
使用 setItem、getItem 和 removeItem。
存储和读取数据 是 CoddyKit 上的免费 JavaScript Academy 课时。 这是第 1 节课，共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 JavaScript Academy 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 JavaScript Academy 课程共包含 4 节课。
浏览器键值存储
网页存储为每个来源在浏览器中提供一个简单的键值 store。两个接口 localStorage 和 sessionStorage 共享相同的方法，并且只存储字符串。
使用 setItem 写入
使用 setItem(key, value) 保存值。两个参数都必须是字符串。
localStorage.setItem("theme", "dark");
localStorage.setItem("username", "ada");使用 getItem 读取
使用 getItem(key) 获取值。如果键不存在，它会返回 null，而不是 undefined。
const theme = localStorage.getItem("theme"); // "dark"
const missing = localStorage.getItem("nope"); // null属性访问
您也可以像访问对象属性一样读取和写入，但方法形式更清晰，还能避免与内置名称冲突。请优先使用这些方法。
localStorage.theme = "light"; // works
console.log(localStorage.theme); // "light"移除单个项目
使用 removeItem(key) 删除单个条目。移除不存在的键不会产生影响。
localStorage.removeItem("username");清除所有内容
clear() 会清除当前来源的所有键。请谨慎使用，因为没有撤销操作。
localStorage.clear();一切都是字符串
存储只能保存字符串。数字和布尔值会被强制转换为文本。读取后它们仍是字符串，需要时请自行转换。
localStorage.setItem("count", 5);
const n = localStorage.getItem("count"); // "5" (string)
const num = Number(n); // 5统计键的数量
length 属性会告诉您存储了多少个键，而 key(index) 会返回指定位置的名称。这对遍历很有用。
console.log(localStorage.length);
const firstKey = localStorage.key(0);遍历存储内容
使用 length 和 key() 遍历所有已存储的键，并在遍历过程中读取每个值。
for (let i = 0; i < localStorage.length; i++) {
const k = localStorage.key(i);
console.log(k, localStorage.getItem(k));
}检查是否存在
由于缺失的键会返回 null，您可以通过简单的比较来检查其是否存在。
if (localStorage.getItem("token") !== null) {
console.log("user has a token");
}仅限同源访问
存储的作用域是来源（协议 + 主机 + 端口）。一个网站无法读取另一个网站的存储，并且 http 和 https 会被视为不同的来源。
快速检查
读取和写入网页存储。
回顾
网页存储是按来源划分的字符串键值 store。使用 setItem、getItem（缺失时返回 null）、removeItem 和 clear。使用 length 和 key(i) 进行遍历。所有内容都是字符串，因此请自行转换类型；存储按来源彼此隔离。
常见问题解答
「存储和读取数据」课时是免费的吗？
是的 — 「存储和读取数据」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 JavaScript Academy 课程的其余内容，请升级到 CoddyKit PRO。 JavaScript Academy 课程共包含 4 节课。
「存储和读取数据」这节课中我会学到什么？
使用 setItem、getItem 和 removeItem。 你通过在浏览器中直接运行的动手代码来练习 JavaScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。
学习 JavaScript Academy 需要有经验吗？
无需任何先前经验。CoddyKit 上的 JavaScript Academy 课程适合初学者到高级学习者，你可以从这里开始或从头开始，按照自己的节奏学习。 这是第 1 节课，共 4 节。
「存储和读取数据」课时需要多长时间？
大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动，所以你能稳步进步，并在网页和应用中从离开的地方继续。
我能在这节 JavaScript Academy 课中编写并运行代码吗？
能。每节 JavaScript Academy 课都包含内置代码编辑器，你可以在浏览器中直接编写并运行真实代码，并获得即时 AI 反馈 — 无需本地设置。