封装了localStorage和sessionStorage的通用存储模块

本地存储

/**
 * 通用存储类，用于封装 localStorage 和 sessionStorage 的操作
 */
// 封装 localStorage 和 sessionStorage 的方法

class Storage {
    /**
   * 构造函数，初始化存储类型
   * @param {string} type - 存储类型，可选值为 'localStorage' 或 'sessionStorage'
   */
  constructor(type = 'localStorage') {
    this.type = type;
    this.storage = type === 'localStorage' ? window.localStorage : window.sessionStorage;
  }

  // 设置值
  /**
   * 设置值到存储中
   * @param {string} key - 存储的键
   * @param {any} value - 要存储的值
   * @param {number} expires - 可选，数据过期时间（毫秒数）
   */
  setItem(key, value, expires) {
    let data = {
      value: value,
      timestamp: Date.now()
    };
    if (expires) {
      data.expires = Date.now() + expires;
    }
    this.storage.setItem(key, JSON.stringify(data));
  }
 /**
   * 从存储中获取值
   * @param {string} key - 存储的键
   * @returns {any} 存储的值，如果数据过期或不存在则返回 null
   */
  // 获取值
  getItem(key) {
    const data = this.storage.getItem(key);
    if (data) {
      const parsedData = JSON.parse(data);
      if (parsedData.expires && Date.now() >= parsedData.expires) {
        this.remove(key);
        return null;
      }
      return parsedData.value;
    }
    return null;
  }

  // 删除值
  /**
   * 从存储中删除值
   * @param {string} key - 要删除的键
   */
  remove(key) {
    this.storage.removeItem(key);
  }

  // 清空所有数据

  /**
   * 清空存储中的所有数据
   */
  clear() {
    this.storage.clear();
  }

 

  
}

// 创建 localStorage 和 sessionStorage 的实例
const localStorage = new Storage('localStorage');
const sessionStorage = new Storage('sessionStorage');

export { localStorage, sessionStorage };

项目中使用

import { localStorage, sessionStorage } from './storage';

// 使用 localStorage
localStorage.setItem('user', { id: 1, name: 'berlvy' }, 60 * 60 * 1000); // 设置用户信息，1小时后过期
console.log(localStorage.getItem('user')); // 获取用户信息
localStorage.remove('user'); // 删除用户信息

// 使用 sessionStorage
sessionStorage.setItem('theme', 'colorful');
console.log(sessionStorage.getItem('theme'));
sessionStorage.remove('theme');