localStorage功能在开发中的两个简单代码

localStorage作为存储功能在项目中我使用的次数是很多的。作为一个前端，尽量是让用户少输入，接口少请求，除了一些特定的数据不要存储在本地，其它数据都会放在本地，并加入时效机制。

本地存储、读取数据方法

/**
 * 本地存储、读取功能
 * @param { String } item 本地存储的id
 * @param { any } data 本地存储的详情 不传视为读取
 * @param { Number } time 有效时间，单位s 默认保存3天 259200s
 * @return { any } 视参数而定
 */
const local = (item, data, time) => {
    // 获取本地保存的有效期
    const validity = localStorage.getItem(`${item}-validity`);
    // 获取localStorage储存的时间
    const localTime = new Date(localStorage.getItem(`${item}-time`));
    if (data) {
        // 存储
        localStorage.setItem(item, JSON.stringify(data));
        // 存储时间
        localStorage.setItem(`${item}-time`, new Date());
        // 存储有效时间
        localStorage.setItem(`${item}-validity`, time || 259200);
    } else if (new Date() - localTime < validity * 1000) {
        // 有效期内
        return JSON.parse(localStorage.getItem(item));
    }
    // 失效
    return null;
};
const obj = {
    name: '叶落尘',
    address: '成都'
}
// 存储功能 模拟10s
local('obj', obj, 10);
// 读取
const timer = setInterval(() => {
    const localObj = local('obj');
    console.log(localObj);
    if (!localObj) {
        clearInterval(timer);
    }
}, 1000);

线上运行时清除缓存

有时候会出现上线之后，由于业务变动，或者突发状况，导致本来前后端相约好了的字段发生变化，这时候最快捷、安全、暴力的解决方法就是localStorage.clear()。
过年的时候就遇到这种情况，大年三十的时候，大家乐呵乐呵看春晚，而我还在改代码0.0。

/**
 * 项目清除本地存储
 * @param { String } sessionId 项目ID
 */
const clearLocal = (sessionId) => {
    // 获取版本号的本地存储的值
    const item = localStorage.getItem(sessionId);
    // 如果本地没有该值，即为全新版本，清除并存储
    if (!item) {
        localStorage.clear();
        localStorage.setItem(sessionId, 'success');
    }
};
// 版本1
clearLocal('v1');
const obj = {
    name: '叶落尘',
    address: '成都'
}
// 使用local()存储
local('obj', obj);
console.log(local('obj')); // {name: "叶落尘", address: "成都"}
// 若项目改变，版本号变化
clearLocal('v2');
console.log(local('obj')); // null

以上就是两个简单的方法，当然是有bug的，毕竟是获取浏览器的时间，如果用户改变了机器时间，就失效咯。

若有问题欢迎指出，谢谢～