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中获取元素索引的函数
Sep 10 Javascript
JS操作Cookies包括(读取添加与删除)
Dec 26 Javascript
JavaScript实现的GBK、UTF8字符串实际长度计算函数
Aug 27 Javascript
JS获取元素多层嵌套思路详解
May 16 Javascript
JavaScript实现邮箱地址自动匹配功能代码
Nov 28 Javascript
js实现三级联动效果(简单易懂)
Mar 27 Javascript
JS实现线性表的链式表示方法示例【经典数据结构】
Apr 11 Javascript
JS触摸事件、手势事件详解
May 04 Javascript
微信小程序实现的贪吃蛇游戏【附源码下载】
Jan 03 Javascript
js中let和var定义变量的区别
Feb 08 Javascript
对Vue2 自定义全局指令Vue.directive和指令的生命周期介绍
Aug 30 Javascript
微信小程序之事件交互操作实例分析
Dec 03 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
yii操作session实例简介
2014/07/31 PHP
php将文本文件转换csv输出的方法
2014/12/31 PHP
护卫神php套件 php版本升级方法(php5.5.24)
2015/05/10 PHP
php正则判断是否为合法身份证号的方法
2017/03/16 PHP
Yii框架核心组件类实例详解
2019/08/06 PHP
编写Js代码要注意的几条规则
2010/09/10 Javascript
JS、CSS加载中的小问题探讨
2013/11/26 Javascript
Event altKey,ctrlKey,shiftKey属性解析
2013/12/18 Javascript
jQuery下拉美化搜索表单效果代码分享
2015/08/25 Javascript
javascript中的正则表达式使用详解
2015/08/30 Javascript
莱鸟介绍window.print()方法
2016/01/06 Javascript
详解Vue.use自定义自己的全局组件
2017/06/14 Javascript
AngularJS学习笔记之表单验证功能实例详解
2017/07/06 Javascript
js字符限制(字符截取) 一个中文汉字算两个字符
2017/09/12 Javascript
微信小程序实现简单评论功能
2018/11/28 Javascript
详解小程序BackgroundAudioManager踩坑之旅
2019/12/08 Javascript
vue-socket.io接收不到数据问题的解决方法
2020/05/13 Javascript
详解ES6中class的实现原理
2020/10/03 Javascript
[00:33]2018DOTA2亚洲邀请赛TNC出场
2018/04/04 DOTA
Python生成数字图片代码分享
2017/10/31 Python
python中实现字符串翻转的方法
2018/07/11 Python
django框架创建应用操作示例
2019/09/26 Python
信号生成及DFT的python实现方式
2020/02/25 Python
Python容器类型公共方法总结
2020/08/19 Python
Python配置pip国内镜像源的实现
2020/08/20 Python
基于Python-turtle库绘制路飞的草帽骷髅旗、美国队长的盾牌、高达的源码
2021/02/18 Python
阿联酋航空官方网站:Emirates
2017/10/17 全球购物
有个性的自我评价范文
2013/11/15 职场文书
大学生饮食连锁店创业计划书
2014/01/17 职场文书
代理班主任的自我评价
2014/02/04 职场文书
小露珠教学反思
2014/04/30 职场文书
民事诉讼代理授权委托书范本
2014/10/08 职场文书
2015纪念九一八事变84周年演讲稿
2015/03/19 职场文书
2015年社区计生工作总结
2015/04/21 职场文书
合作意向书范本
2019/04/17 职场文书
遇事可以测出您的见识与格局
2019/09/16 职场文书