封装一个关于localStorage,sessionStorage,cookie的 storage.js 脚本

如果可以实现记得点赞分享,谢谢老铁~

/**
 *
 * 本地存储
 */
  //--------------localStorage----------------------------
  export const setData = (name, obj) => {
    if (typeof obj === "object") {
      obj = JSON.stringify(obj);  //将obj转为String类型

      //var obj = "{userName:userName,password:password}"
    }
    localStorage.setItem(name, obj);  //localStorage存储
  }
  export const getData = (key) => {
    var data;
    try {
      var obj = localStorage.getItem(key);
      data = JSON.parse(obj);  //将obj转为JSON  localStorage只能存取字符串。所以取出的必须转换成对象
    } catch (e) {
      data = obj;
    }
    return data;
  }
  //清除指定的存储
  export const rmStorage =  (key) => {
    localStorage.removeItem(key);
    //localStorage.clear();  清空所有
  }


  //--------------sessionStorage----------------------------

  export const setSessionData = (name, obj) =>{
    if (typeof obj === "object") {
      obj = JSON.stringify(obj);  //将obj转为String类型

    }
    sessionStorage.setItem(name, obj);  //localStorage存储
  }
  export const  getSessionData =  (key) =>{
    var data;
    try {
      var obj = sessionStorage.getItem(key);
      data = JSON.parse(obj);  //将obj转为JSON
    } catch (e) {
      data = obj;
    }
    return data;
  }
  //清除指定的存储
  export const rmSessionStorage = (key) =>{
    sessionStorage.removeItem(key);
  }
  /**
   *@author    zxd
   * @param name cookie名
   * @param value  存储值
   * @param days  有效期(天)
   */
   export const setCookie = (name, value, days) =>{
    var d = new Date();
    d.setTime(d.getTime() + 24*60*60*1000*days);
    window.document.cookie = name + "=" + value + ";path=/;expires=" + d.toGMTString();
  }

  /**
   *@author    zxd
   * @param name cookie名
   * @returns {null}
   */
   export const getCookie =  (name) =>{
    var v = window.document.cookie.match('(^|;) ?' + name + '=([^;]*)(;|$)');
    return v ? v[2] : null;
  }

  /**
   * @author    zxd
   * 根据cookie名删除
   * @param name
   */
   export const deleteCookie = (name) =>{
    this.setCookie(name, '', -1);
  }

localStoragesessionStoragecookie都是在Web开发中用于在浏览器端存储数据的机制。 localStorage是一种持久化存储机制,数据会一直保存在浏览器中,直到被显式清除或通过代码删除。存储在localStorage中的数据可以跨会话和页面保持不变,即使浏览器关闭和重新打开也不会丢失。localStorage只能通过JavaScript访问,它提供了setItem、getItem和removeItem等方法来操作存储的数据。 sessionStorage也是一种存储数据的机制,但与localStorage不同的是,存储在sessionStorage中的数据仅在当前会话(当前标签页或窗口)中有效。当会话结束(标签页或窗口关闭)时,存储在sessionStorage中的数据就会被清除。sessionStorage的使用方法和localStorage相似,也是通过setItem、getItem和removeItem等方法来操作数据。 cookie是一种在浏览器和服务器之间传递的小型文本文件,用于存储会话相关的信息。与localStoragesessionStorage不同,cookie的数据会随着每个HTTP请求发送到服务器端,并且可以设置过期时间。由于cookie会在每个请求中传输,所以存储在cookie中的数据大小有限制(通常为几KB)。可以使用JavaScript或服务器端语言来设置和读取cookie。 总结:localStoragesessionStorage主要用于在浏览器端持久化存储数据,而cookie主要用于在浏览器和服务器之间传递会话相关的信息。具体使用哪种机制取决于实际需求。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

前端加油站

你遇到的坑将由我来踩

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值