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 相关文章推荐
js分解url参数(面向对象-极简主义法应用)
Aug 09 Javascript
js调试工具console.log()方法查看js代码的执行情况
Aug 08 Javascript
分享一则javascript 调试技巧
Jan 02 Javascript
JavaScript实现打字效果的方法
Jul 10 Javascript
JavaScript实现点击文本自动定位到下拉框选中操作
Jun 15 Javascript
vue组件实例解析
Jan 10 Javascript
jquery仿ps颜色拾取功能
Mar 08 Javascript
详解angular element()方法使用
Apr 08 Javascript
基于angular实现三级联动的生日插件
May 12 Javascript
关于HTML5的data-*自定义属性的总结
May 05 Javascript
详解JS中统计函数执行次数与执行时间
Sep 04 Javascript
利用百度echarts实现图表功能简单入门示例【附源码下载】
Jun 10 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
后宫无数却洁身自好的男主,唐三只爱小舞
2020/03/02 国漫
SONY SRF-22W(33W)的电路分析和维修案例
2021/03/02 无线电
mysql建立外键
2006/11/25 PHP
fleaphp rolesNameField bug解决方法
2011/04/23 PHP
php调用C代码的实现方法
2014/03/11 PHP
php实现按文件名搜索文件的远程文件查找器
2014/05/10 PHP
ThinkPHP之getField详解
2014/06/20 PHP
JavaScript实现网页截图功能
2014/10/16 Javascript
PHP+jQuery+Ajax实现多图片上传效果
2015/03/14 Javascript
JavaScript动态改变表格单元格内容的方法
2015/03/30 Javascript
BootStrap3使用错误记录及解决办法
2016/12/22 Javascript
Vue.js结合Ueditor富文本编辑器的实例代码
2017/07/11 Javascript
VUE中v-on:click事件中获取当前dom元素的代码
2018/08/22 Javascript
详解Vue-axios 设置请求头问题
2018/12/06 Javascript
详解datagrid使用方法(重要)
2020/11/06 Javascript
在Linux上安装Python的Flask框架和创建第一个app实例的教程
2015/03/30 Python
Python脚本实现12306火车票查询系统
2016/09/30 Python
利用python生成一个导出数据库的bat脚本文件的方法
2016/12/30 Python
flask + pymysql操作Mysql数据库的实例
2017/11/13 Python
python训练数据时打乱训练数据与标签的两种方法小结
2018/11/08 Python
浅谈Python3多线程之间的执行顺序问题
2020/05/02 Python
收集的7个CSS3代码生成工具
2010/04/17 HTML / CSS
苹果美国官方商城:Apple美国
2016/08/24 全球购物
新西兰最大的连锁超市:Countdown
2020/06/04 全球购物
客服端调用EJB对象的几个基本步骤
2012/01/15 面试题
Delphi笔试题
2016/11/14 面试题
物流专业大学生的自我鉴定
2013/11/13 职场文书
写自荐信三大法宝
2014/01/24 职场文书
水利公司纪检监察自我鉴定
2014/02/25 职场文书
工会文体活动总结
2015/05/07 职场文书
2016年会开场白台词
2015/06/01 职场文书
郭明义观后感
2015/06/08 职场文书
2016春季小学开学寄语
2015/12/03 职场文书
python如何为list实现find方法
2022/05/30 Python
Redis keys命令的具体使用
2022/06/05 Redis
MySql中的json_extract函数处理json字段详情
2022/06/05 MySQL