var db = function () {
// 本地存储前缀,减少命名冲突
var prefix = 'ydb';
return {
setPrefix: function (_prefix) {
prefix = _prefix;
// 本地存储前缀只允许修改一次,如果多次修改,由于单例,可能会导致只能写入,不能读取
this.setPrefix = null;
},
getPrefix: function () {
return prefix;
},
set: function (key, value, expriess = 0) {
var o = {
value,
createTime: Date.now(),
expriess
};
localStorage.setItem(prefix + '-' + key, JSON.stringify(o));
},
get: function (key) {
var storage = JSON.parse(localStorage.getItem(prefix + '-' + key));
if (!!storage === false) {
return null;
}
else {
if (storage.expriess <= 0) {
return storage.value;
}
else {
if (storage.expriess + storage.createTime > Date.now()) {
return storage.value;
}
// 过期销毁
this.remove(key);
return null;
}
}
},
remove(key) {
localStorage.removeItem(prefix + '-' + key);
},
clear() {
for (var key in localStorage) {
if (key.includes(prefix)) {
this.remove(key.split('-')[1]);
}
}
}
}
}()

这里使用来模块模式隐藏存储前缀,避免开发人员意外修改前缀导致无法读取存储的值。

定义了get,set,remove,clear四个特权方法,通过它们来操作prefix,隐藏了对prefix的操作细节,这里使用了js中的一个小技巧,用函数表达式来模拟块级作用域,由于这四个函数构成了闭包,外部函数的活动对象,当中包括prefix,添加到了这四个函数的作用链中,所以可以一直使用这个活动对象,即使外部函数执行完成,这个变量prefix也不会被回收。

别看这个例子很简单,但是里面涉及到的知识点和编程思想还是很多的,望多多思考。

localstorage二次封装-模块模式的更多相关文章

  1. localStorage二次封装-----设置过期时间

    export default{ set(key,data,time){ let obj={ data=data, ctime:(new Date()).getTime(),//时间戳,同Date.no ...

  2. web自动化针对PO模式进行二次封装之basepage

    在PO模式当中,我们做到了页面对象与测试用例的分离,但在页面对象编写时,我们仍然还有优化的空间.页面对象有一些共同的基本操作,可以封装起来,并可以在基本操作当中加上日志和异常截图的处理.比如说我们在查 ...

  3. 项目依赖模块解决、二次封装Response、后台数据库配置、user模块user表设计、前台创建及配置

    今日内容概要 二次封装Response 后台数据库配置 user模块user表设计 前台创建及配置 内容详细 补充--项目依赖模块 # 导出项目依赖模块和安装项目依赖模块 第三方模块--->导出 ...

  4. APP自动化针对PO模式进行二次封装之basepage

    APP自动化跟WEB自动化所使用的框架基本一样,都是采用的PO模式结合pytest框架编写自动化测试脚本,为了提高代码的复用性.稳定性和易维护性,我们针对PO模式进行了二次封装,将日志,等待以及异常截 ...

  5. 3) drf 框架生命周期 请求模块 渲染模块 解析模块 自定义异常模块 响应模块(以及二次封装)

    一.DRF框架 1.安装 pip3 install djangorestframework 2.drf框架规矩的封装风格 按功能封装,drf下按不同功能不同文件,使用不同功能导入不同文件 from r ...

  6. PHP设计模式(二)工厂方法模式(Factory Method For PHP)

    简单工厂简述: 简单工厂模式实现了生产产品类的代码跟客户端代码分离,在工厂类中你可以添加需要生成长跑的逻辑代码(new 产品类),但是问题来了,优秀的代码是符合"开闭原则"如果你要 ...

  7. JavaScript设计模式-单例模式、模块模式(转载 学习中。。。。)

    (转载地址:http://technicolor.iteye.com/blog/1409656) 之前在<JavaScript小特性-面向对象>里面介绍过JavaScript面向对象的特性 ...

  8. Java 9 揭秘(6. 封装模块)

    Tips 做一个终身学习的人. 在这章节中, 主要介绍以下内容: 封装Java模块的不同格式 JAR格式增强 什么是多版本JAR 如何创建和使用多版本JAR JMOD是什么格式 如何使用jmod工具来 ...

  9. 一个普通的 Zepto 源码分析(二) - ajax 模块

    一个普通的 Zepto 源码分析(二) - ajax 模块 普通的路人,普通地瞧.分析时使用的是目前最新 1.2.0 版本. Zepto 可以由许多模块组成,默认包含的模块有 zepto 核心模块,以 ...

随机推荐

  1. 在Myeclipse10中配置tomcat后新建工程

    1.配置tomcat6.0 这里不在细说,和eclipse配置是一模一样的. 2.新建动态网站项目 3.配置显示服务器窗口 4.把项目与服务器链接 5.运行项目

  2. HEX 文件格式

    例 FDFFF885C3 :每行开头 第一个字节:表示本行的数据长度, 第二个,第三个字节表示本行数据的起始地址. 第四字节表示数据类型,数据类型有:0x00.0x01.0x02.0x03.0x04. ...

  3. Java 网址短链接服务原理及解决方案

    一.背景 现在在各种圈的产品各种推广地址,由于URL地址过长,不美观.不方便收藏.发布.传播以及各种发文字数限制等问题,微信.微博都在使用短链接技术.最近由于使用的三方的生成.解析短链接服务开始限制使 ...

  4. open 管道用法|Getopt::Long

    #!/usr/bin/perl use strict; use warnings; use Getopt::Long; my ($number,$in,$out); GetOptions( " ...

  5. 将java list转换为js的数组

    var data = new Array();<%ArrayList list = new ArrayList();list.add(0);list.add(1);if(list!=null){ ...

  6. 80)PHP,扩展工具类

    啥是扩展工具类:这个问题很深奥,自己慢慢理解吧. 首先  对于session的处理函数是扩展工具类. ②图片处理类 ③验证码生成类 ④算是项目中的一个功能模块. 扩展工具类   放在我们的framew ...

  7. Linux下安装mysql(yun方式)

    1.进入下载好的mysql版本 cd /usr/local/mysql 2.解压安装包 tar -xzvf mysql-5.7.11.tar.gz 3.改名 直接改或者 mv  文件名 要改的文件名m ...

  8. python-django-fastdfs+Nginx的安装和配置_20191122

    python-django-fastdfs+Nginx的安装和配置 FastDFS文件系统 FastDFS文件系统简介: 是c语言编写的,是淘宝的架构师写的,存储淘宝的图片,后来开源了, fastDF ...

  9. Telnet和SSH区别

    首先,telnet和ssh都是连接远程计算机的连接协议,可以完成对完成计算机的控制,方便维护.其次,他们都是基于TCP/IP协议下的,所以连接时都需要知道目标机的网址或者域名,第三,他们都是与远程主机 ...

  10. Android开发之《制作自己的su文件》

    目录结构  ─ hello ├── jni ├── Android.mk └── hello.c 编译步骤: # cd hello # export NDK_PROJECT_PATH=`pwd` # ...