本地存储封装(版本一)

本地存储封装(版本一)

  • 最近学习pinia,然后再一次遇到了本地存储的相关问题。
  • 然后就心血来潮,封装了一个感觉还可以的封装函数。
  • 同时欢迎大家指出我的不足,我会汲取意见不断改进进步。
  • 使用ts封装,可以使用Symbol替代enmu
import { checkDataType, checkEmpty } from './utils'

// 定义存储类型枚举对象
const enum Storages { cookie, local ,session }

/**
 * @description 设置存储
 * 
 * @param { Storages } type 存储的方式
 * @param { string } key 存储的键
 * @param { any } value 存储的值
 * @param { number | boolean } indite 到期时间
 * @param { boolean } merge 是否合并前后修改的value对象
 */

function setStorage (type:Storages, key:string, value:any, indite?:number|boolean, merge?:boolean) {
    let text:string;
    switch (checkDataType(value)) {
        case '[object Object]':
        case '[object Array]':
            let oldVal = getStorage(type, key)
            if (merge || indite === true && checkEmpty(merge) && checkDataType(oldVal, 'object')) {
                for (let key in value) {
                    if (checkEmpty(value[key], true)) {
                        delete value[key];
                        delete oldVal[key];
                    }
                }
                text = JSON.stringify({ ...oldVal, ...value });
            } else {
                text = JSON.stringify(value);
            }
            break;
        default: text = value;
    }

    switch(type) {
        case Storages.cookie:
            if (checkDataType(indite, 'number')) {
                let date = new Date();
                date.setTime(date.getTime() - 8 * 60 * 60 * 1000 + (indite as number) * 1000);
                document.cookie = key + "=" + text + ";expires=" + date;
            } else {
                document.cookie= key + "=" + text;
            }
            break;
        case Storages.local:
            localStorage.setItem(key, text);
            break;
        case Storages.session:
            sessionStorage.setItem(key, text);
            break;
    }
}

/**
 * @description 查询存储
 * 
 * @param { Storages } type 存储的方式
 * @param { string } key 查询的key
 * @param { string } valueKey 查询value的key
 * @returns 返回的查询结果
 */

function getStorage (type:Storages ,key:string, valueKey?:string):any {
    let value = "";

    switch(type) {
        case Storages.cookie:
            const cookieArr = document.cookie.split(";");
            cookieArr.forEach(item => {
                if (item.split("=")[0].trim() === key) {
                    value = item.split("=")[1].trim();
                }
            });
            break;
        case Storages.local:
            if(localStorage.getItem(key)) value = (localStorage.getItem(key) as string);
            break;
        case Storages.session:
            if(sessionStorage.getItem(key)) value = (sessionStorage.getItem(key) as string);
            break;
    }

    try {
        let callbackObj = JSON.parse(value);
        if (valueKey && callbackObj[valueKey]) return callbackObj[valueKey];
        return callbackObj;
    } catch {
        return value;
    }
};

/**
 * @description 删除存储
 * 
 * @param { Storage } type 存储的方式
 * @param { string } key 对应的key值
 */

function delStorage (type:Storages, key:string) {
    switch(type) {
        case Storages.cookie:
            // setStorage(type, key, null, -1);
            break;
        case Storages.local:
            localStorage.removeItem(key)
            break;
        case Storages.session:
            sessionStorage.removeItem(key)
            break;
    }
};


/* --------------------cookie----------------------- */

export function setCookie(key:string, value:any, indite?:number|boolean, merge?:boolean):void {
    setStorage(Storages.cookie, key, value, indite, merge)
}

export function getCookie(key:string, valueKey?:string) {
    return getStorage(Storages.cookie, key, valueKey)
}

export function delCookie(key:string) {
    delStorage(Storages.cookie, key)
}


/* --------------------local----------------------- */

export function setLocal(key:string, value:any, merge?:number|boolean) {
    setStorage(Storages.local, key, value, merge)
}

export function getLocal(key:string, valueKey?:string) {
    return getStorage(Storages.local, key, valueKey)
}

export function delLocal(key:string) {
    delStorage(Storages.local, key)
}


/* --------------------session----------------------- */

export function setSession(key:string, value:any, merge?:number|boolean) {
    setStorage(Storages.session, key, value, merge)
}

export function getSession(key:string, valueKey?:string) {
    return getStorage(Storages.session, key, valueKey)
}

export function delSession(key:string) {
    delStorage(Storages.session, key)
}

  • 4
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值