localstorage 是 HTML5 提供的在客户端存储数据的新方法,主要作用是将数据保存在客户端中,并且数据是永久保存的,除非人为干预删除。
localstorage作为本地存储来使用,解决了cookie存储空间不足的问题:cookie中每条cookie的存储空间为4k,但localStorage的存储空间有5M大小。另外,相比于cookie,localStorage可以节约带宽,在同一个域内,浏览器每次向服务器发送请求,http都会带着cookie,使cookie在浏览器和服务器之间来回传递,浪费带宽,但localStorage将第一次请求的数据直接存储到本地,避免了来回传递。
localstorage 的局限 1、只有版本较高的浏览器中才支持 localstorage 2、localStorage的值的类型限定为string类型,使用 JSON 时需转换 3、如果存储内容过多会消耗内存空间,导致页面变卡,因为localStorage本质上是对字符串的读取
localstorage 有两种方法:
分别是 localstorage 和 sessionStorage 。sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后,数据会被删除。localStorage与sessionStorage的唯一区别就是localStorage属于永久性存储,而sessionStorage在当会话结束的时候,sessionStorage中的键值对会被清空。
//封装操作localStorage本地储存的方法 var storage = { set(key, value){ localStorage.setItem(key,JSON.stringify(value)); }, get(key){ retrun JSON.parse(localStorage.getItem(key)); }, remove(key){ localStorage.removeItem(key); } } export default storage;