JavaScript实现基于Cookie的存储类实例


Posted in Javascript onApril 10, 2015

本文实例讲述了JavaScript实现基于Cookie的存储类。分享给大家供大家参考。具体分析如下:

通过这个JS类,你可以象使用session一样使用cookie,非常简单了!

/*
 * CookieStorage.js
 * 本类实现像localStorage和sessionStorage一样的存储API
 * 不同的是,它是基于HTTP Cookies实现的.
 */
function CookieStorage(maxage, path) {
// 两个参数分别代表储存有效期和作用域
 // 获取一个储存全部cookies的对象
 var cookies = (function() {
 // 类型之前介绍的getCookies函数
  var cookies = {};
  // 该对象最终会返回
  var all = document.cookie;
  // 以大字符串的形式获取所有cookies的信息
  if (all === "")
  // 如果该属性为空白符
   return cookies;
   // 返回一个空对象
  var list = all.split("; ");
  // 分离出名/值对
  for(var i = 0; i < list.length; i++) {
  // 遍历每个cookie
   var cookie = list[i];
   var p = cookie.indexOf("=");
   // 找到第一个“=”符号
   var name = cookie.substring(0,p);
   // 获取cookie的名字
   var value = cookie.substring(p+1);
   // 获取cookie对应的值
   value = decodeURIComponent(value);
   // 对其值进行解码
   cookies[name] = value;
   // 将名值对存储到对象中
  }
  return cookies;
 }());
 // 将所有cookie的名字存储到一个数组中
 var keys = [];
 for(var key in cookies) keys.push(key);
 // 现在定义储存API公共的属性和方法
 // 储存的cookies的个数
 this.length = keys.length;
 // 返回第n个cookie的名字,如果n越界则返回null
 this.key = function(n) {
  if (n < 0 || n >= keys.length) return null;
  return keys[n];
 };
 // 返回指定名字的cookie值,如果不存在则返回null
 this.getItem = function(name){
 return cookies[name] || null;
 };
 // 储存cookie值
 this.setItem = function(key, value) {
  if (!(key in cookies)) {
  // 如果要促成的cookie还不存在
   keys.push(key);
   // 将指定的名字加入到储存所有cookie名的数组中
   this.length++;
   // cookies个数加一
  }
  // 将该名/值对数据存储到cookie对象中.
  cookies[key] = value;
  // 开始正式设置cookie.
  // 首先将要储存的cookie的值进行编码
  // 同时创建一个“名称=编码后的值”形式的字符串
  var cookie = key + "=" + encodeURIComponent(value);
  // 将cookie的属性也加入到该字符串中
  if (maxage) cookie += "; max-age=" + maxage;
  if (path) cookie += "; path=" + path;
  // 通过document.cookie属性来设置cookie
  document.cookie = cookie;
 };
 // 删除指定的cookie
 this.removeItem = function(key) {
  if (!(key in cookies)) return;
  // 如果cookie不存在,则什么也不做
  // 从内部维护的cookies组删除指定的cookie
  delete cookies[key];
  // 同时将cookie中的名字也在内部的数组中删除.
  // 如果使用ES5定义的数组indexOf()方法会更加简单.
  for(var i = 0; i < keys.length; i++) {
  // 遍历所有的名字
   if (keys[i] === key) { 
   // 当我们找到了要找的那个
    keys.splice(i,1); 
 // 将它从数组中删除.
    break;
   }
  }
  this.length--; 
  // cookies个数减一
  // 最终通过将该cookie的值设置为空字符串
  //以及将有效期设置为0来删除指定的cookie.
  document.cookie = key + "=; max-age=0";
 };
 // 删除所有的cookies
 this.clear = function() {
  // 循环所有的cookies的名字,并将cookies删除
  for(var i = 0; i < keys.length; i++)
   document.cookie = keys[i] + "=; max-age=0";
  // 重置所有的内部状态
  cookies = {};
  keys = [];
  this.length = 0;
 };
}

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
使用javascript访问XML数据的实例
Dec 27 Javascript
jquery动态改变onclick属性导致失效的问题解决方法
Dec 04 Javascript
jQuery实现长按按钮触发事件的方法
Feb 02 Javascript
JS实现表格数据各种搜索功能的方法
Mar 03 Javascript
javascript实现checkBox的全选,反选与赋值
Mar 12 Javascript
JS+CSS实现表格高亮的方法
Aug 05 Javascript
整理JavaScript对DOM中各种类型的元素的常用操作
May 05 Javascript
详解百度百科目录导航树小插件
Jan 08 Javascript
JQuery实现table中tr上移下移的示例(超简单)
Jan 08 jQuery
node.js连接mysql与基本用法示例
Jan 05 Javascript
JS实现放大镜效果
Sep 21 Javascript
详解ES6 中的Object.assign()的用法实例代码
Jan 11 Javascript
JavaScript 变量、作用域及内存
Apr 08 #Javascript
JavaScript Function函数类型介绍
Apr 08 #Javascript
JavaScript 模块化编程(笔记)
Apr 08 #Javascript
JavaScript DOM事件(笔记)
Apr 08 #Javascript
javascript笛卡尔积算法实现方法
Apr 08 #Javascript
JavaScript获取指定元素位置的方法
Apr 08 #Javascript
javascript跨域原因以及解决方案分享
Apr 08 #Javascript
You might like
二十行语句实现从Excel到mysql的转化
2006/10/09 PHP
thinkPHP框架动态配置用法实例分析
2018/06/14 PHP
ThinkPHP5.0多个文件上传后找不到临时文件的修改方法
2018/07/30 PHP
javascript Keycode对照表
2009/10/24 Javascript
Jquery Ajax学习实例3 向WebService发出请求,调用方法返回数据
2010/03/16 Javascript
jQuery创建自己的插件(自定义插件)的方法
2010/06/10 Javascript
浅谈Javascript事件处理程序的几种方式
2012/06/27 Javascript
javascript动态添加、修改、删除对象的属性与方法详解
2014/01/27 Javascript
JS中如何判断传过来的JSON数据中是否存在某字段
2014/08/18 Javascript
javascript实现动态模态绑定grid过程代码
2014/09/22 Javascript
js实现的鼠标滚轮滚动切换页面效果(类似360默认页面滚动切换效果)
2016/01/27 Javascript
如何利用Promises编写更优雅的JavaScript代码
2016/05/17 Javascript
JS判断日期格式是否合法的简单实例
2016/07/11 Javascript
jquery实时获取时间的简单实例
2017/01/26 Javascript
javaScript中封装的各种写法示例(推荐)
2017/07/03 Javascript
vue购物车插件编写代码
2017/11/27 Javascript
JavaScript基础心法 数据类型
2018/03/05 Javascript
js继承的这6种方式!(上)
2019/04/23 Javascript
vue实现微信分享链接添加动态参数的方法
2019/04/29 Javascript
Python 字符串换行的多种方式
2018/09/06 Python
Python os.rename() 重命名目录和文件的示例
2018/10/25 Python
Python实现高斯函数的三维显示方法
2018/12/29 Python
详解Python3网络爬虫(二):利用urllib.urlopen向有道翻译发送数据获得翻译结果
2019/05/07 Python
python设置环境变量的作用整理
2020/02/17 Python
selenium自动化测试入门实战
2020/12/21 Python
纯css3实现走马灯效果
2014/12/26 HTML / CSS
电子商务专业学生的自我鉴定
2013/11/28 职场文书
大学毕业生文采飞扬的自我鉴定
2013/12/03 职场文书
九年级物理教学反思
2014/01/29 职场文书
文字自荐书范文
2014/02/10 职场文书
2014国庆65周年领导讲话稿(3篇)
2014/09/21 职场文书
房屋租赁合同补充协议
2014/10/11 职场文书
2014年第四季度入党积极分子思想汇报(十八届四中全会)
2014/11/03 职场文书
欢迎新生标语2015
2015/07/16 职场文书
中学校园广播稿
2015/08/18 职场文书
Python中for后接else的语法使用
2021/05/18 Python