基于localStorage本地存储(代码封装)

localstorage是html5提供的在客户端存储数据的新方法，主要作用是将数据保存在客户端中，并且数据是永久保存的，它解决了cookie存储空间不足的问题，通常情况下localStorage的存储空间有5M大小。

虽然localstorage的方法非常简单，但为了更加的方便和可维护性，建议大家封装localStorage后进行使用。

代码如下：

const store={
	set:function(key, value, day) { //设置
		let d = new Date();
		let time = 0;
		day = (typeof(day) === 'undefined' || !day) ? 1 : day; // 时间,默认存储1天
		time = d.setHours(d.getHours() + (24 * day)); // 毫秒
		localStorage.setItem(key, JSON.stringify({
			data: value,
			time: time
		}))
	},
	get:function(key) { //获取
		let data = localStorage.getItem(key);
		if (!data) {
			return null;
		}
		let obj = JSON.parse(data);
		if (new Date().getTime() > obj.time) { // 过期
			localStorage.removeItem(key);
			return null;
		} 
		return obj.data;
	},
	clear:function(key) { //清空 
		if (key) { //删除键为key的缓存
			localStorage.removeItem(key);
			return;
		} 
		localStorage.clear(); //清空全部
	},
	has:function(key) { //判断是否存在
		return localStorage.getItem(key) !== null;
	}
};

代码说明:

这段代码定义了一个名为store的类，它提供了简单的封装来处理localStorage的读写操作,它使用JSON来序列化和反序列化存储的数据，并提供了set，get，clear和has方法来操作localStorage。

在原有的基础上它支持存储时间的设置,这样的封装可以使得localStorage的使用更加方便和可维护。

链接: https://fly63.com/course/34_1635