localStorage - Javascript

简介

localStorage 是 HTML5 提供的一种在客户端存储数据的机制。实现了在浏览器中存储键值对，并且一直存在于客户端本地的特性，即便是浏览器关闭了，也不会影响客户端的数据。

使用方法

存储数据

localStorage.setItem(key, value);

其中， key 是存储数据的键名， value 是存储数据的键值。

获取数据

localStorage.getItem(key);

其中， key 是存储数据的键名。

删除数据

localStorage.removeItem(key);

其中， key 是存储数据的键名。

清空数据

localStorage.clear();

该方法将清空 localStorage 中的所有数据。

属性

length

localStorage.length;

该属性用于获取 localStorage 中存储的数据数量。

实例

以下是一个使用 localStorage 进行数据存储的实例：

// 存储数据
localStorage.setItem('name', 'Bob');
localStorage.setItem('age', 22);

// 获取数据
let name = localStorage.getItem('name');
let age = localStorage.getItem('age');

console.log(name);  // 输出 'Bob'
console.log(age);   // 输出 22

// 删除数据
localStorage.removeItem('age');

// 清空数据
localStorage.clear();

总结

localStorage 是一种非常方便的数据存储方式。通过将数据存储在客户端，可以避免频繁地向服务器请求数据，提高页面性能和用户体验。但是需要注意的是，由于在客户端存储的数据不依赖于服务器，当用户在不同的设备或浏览器上打开网站时，数据可能会有所差异。因此需要在应用程序中谨慎使用 localStorage。