封装

2025年01月19日

柏拉文

越努力，越幸运

一、认识

---

为了增强 LocalStorage 的功能，我们可以封装一个支持数据存储有效期的工具类。当数据过期后，进行懒删除（即在数据读取时才判断并清理过期数据）。

二、实现

---

class StorageWithExpiry {
    constructor(prefix = 'app_') {
        this.prefix = prefix; // 添加前缀，避免键名冲突
    }

    /**
     * 设置值到 localStorage，支持有效期
     * @param {string} key 键名
     * @param {*} value 要存储的值
     * @param {number} expiry 有效期（毫秒），可选
     */
    setItem(key, value, expiry = null) {
        const data = {
            value,
            expiry: expiry ? Date.now() + expiry : null, // 计算过期时间
        };
        localStorage.setItem(this.prefix + key, JSON.stringify(data));
    }

    /**
     * 获取值，若已过期则返回 null 并清理过期数据
     * @param {string} key 键名
     * @returns {*} 存储的值或 null
     */
    getItem(key) {
        const item = localStorage.getItem(this.prefix + key);
        if (!item) return null;

        try {
            const data = JSON.parse(item);
            if (data.expiry && Date.now() > data.expiry) {
                // 数据过期，删除该项
                this.removeItem(key);
                return null;
            }
            return data.value;
        } catch (e) {
            console.error('Failed to parse item from localStorage:', e);
            return null;
        }
    }

    /**
     * 删除指定键名的数据
     * @param {string} key 键名
     */
    removeItem(key) {
        localStorage.removeItem(this.prefix + key);
    }

    /**
     * 清空所有存储的数据（仅限当前实例的前缀范围）
     */
    clear() {
        const keys = [];
        for (let i = 0; i < localStorage.length; i++) {
            const fullKey = localStorage.key(i);
            if (fullKey.startsWith(this.prefix)) {
                keys.push(fullKey);
            }
        }
        keys.forEach(key => localStorage.removeItem(key));
    }
}

// 示例用法
const storage = new StorageWithExpiry('myApp_');

// 存储数据，带有效期 5 秒
storage.setItem('user', { name: 'Alice', age: 30 }, 5000);

// 立即读取
console.log(storage.getItem('user')); // { name: 'Alice', age: 30 }

// 5 秒后读取
setTimeout(() => {
    console.log(storage.getItem('user')); // null（过期后自动清理）
}, 6000);