在前端开发中，我们经常需要处理大量的数据，这些数据包括但不限于图片、音频、视频、Json 数据等等。在这些数据不需要频繁刷新的情况下，我们可以通过缓存来提高访问速度，从而提升用户体验。而 npm 包 cachejs 就是一个非常方便的缓存工具包，本文将为大家详细介绍其使用方法。
安装
首先，我们需要在我们的项目中安装 cachejs，可以通过 npm 命令进行安装：
npm install cachejs --save-dev
注意： cachejs 的安装仅限于在 Node.js 和 Webpack 环境下使用。
使用
cachejs 提供了两种缓存方式：localStorage 和 sessionStorage。其中，localStorage 的数据会一直存在本地，即使用户关闭了浏览器，数据依旧存在；而 sessionStorage 的数据只存在于当前会话中，浏览器关闭后将被销毁。
初始化
我们需要在页面中引入 cachejs：
import cache from 'cachejs';
然后，我们需要对 cachejs 进行初始化，指定缓存方式：
cache.init('memory'); // 默认使用 sessionStorage
// 或
cache.init('localStorage'); // 使用 localStorage缓存键值会被存储在一个缓存对象中，该对象默认使用 sessionStorage。如果想要使用 localStorage，可以将 localStorage 作为参数传给 cache.init() 方法。
存储
我们可以使用 cache.set() 方法来进行数据存储：
cache.set(key, value, expiryTime); // 第三个参数可选，单位为毫秒
其中，key 为存储的键，value 为存储的值，expiryTime 是该键值对的过期时间（单位为毫秒）。如果没有指定 expiryTime 或 expiryTime <= 0，则数据永久存储。如果指定了 expiryTime，则在该时间之后，该键值对将被删除。
下面是一个存储的例子：
cache.set('name', 'John');获取
我们可以使用 cache.get() 方法来获取数据：
cache.get(key);
下面是一个获取的例子：
const name = cache.get('name');
console.log(name); // 输出：John如果指定的键值不存在，cache.get() 方法会返回 null。
删除
我们可以使用 cache.delete() 方法来删除缓存数据：
cache.delete(key);
下面是一个删除的例子：
cache.delete('name');清空
我们可以使用 cache.clear() 方法来清空缓存：
cache.clear();
下面是一个清空的例子：
cache.clear();
示例代码
下面是一个完整的示例代码：
-- -------------------- ---- ------- ------ ----- ---- ---------- --------------------------- -- -- ------------ ---- ----------------- -------- ----- ---- - ------------------ ------------------ -- ------- ---------------- --- ------ -- -- - -- ----- --- - ----------------- ----------------- -- ----- ------------- -- - ----- -------- - ----------------- ---------------------- -- ------- -- ------ --------------------- ------------------------------- -- ------- -------------- ------------------------------ -- -------
总结
以上就是 cachejs 的详细使用方法。通过使用 cachejs，我们可以轻松地实现数据缓存，提高网站的访问速度和用户体验。需要注意的是，缓存技术的使用需要注意数据的时效性和安全性，不合理的使用方式可能会导致数据泄漏等问题，因此需要谨慎使用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/76250