JavaScript本地存储(1) : 使用Cookie

在网页开发中，为了某些特殊的效果比如像购物车、页面换肤、记住密码等等就可能需要用到JavaScript的本地存储功能，说到底JavaScript的本地存储就是让网站能够“记住”你，等到下次再访问的时候能够识别出来，当然记住的方式无外乎就是通过在浏览者的电脑上保存一个记录的文件。本系列文章主要讲解这些技术，当然我们实现约定一个类似于下面的接口：

var IStorage = function() {
  this.setItem = function(key, value) {}
  this.getItem = function(key) {}
  this.remove = function(key) {}
}

下面的编程实现将围绕在这个接口展开，关于为什么定义这个接口，我将在下面的文章中阐述。

说到Cookie（也可以叫做Cookies）大家可能比较熟悉，这可以是最早实现本地存储的一个方法之一了，实现也非常简单。基于IStorage我们实现了下述关于Cookie类的代码：

var Cookie = function() {
  this.setItem = function(key, value) {
    var expires = new Date();
    expires.setTime(expires.getTime() + 
            1000 * 60 * 
            60 * 24 * 365);
 
    document.cookie = key + "=" + 
            escape(value) + 
            ";path=/" + 
            "; expires=" + 
            expires.toGMTString();
  }
 
  this.getItem = function(key) {
    var key_equal = key + "=";
    if (document.cookie.length <= 0)
      return "";
    var pos_start = document.cookie.
            indexOf(key_equal);
    if (pos_start == -1)
      return "";
    pos_start += key_equal.length;
    pos_end = document.cookie.
          indexOf(";", pos_start);
    if (pos_end == -1)
      pos_end = document.cookie.length;
 
    return unescape(document.cookie.
            substring(pos_start, pos_end));
  }
 
  this.remove = function(key) {
    this.setItem(key, "");
  }
}

可以看出每个Cookie由key和value这样的键值对组成，而且在这之间以分号相隔，形如key1=value1;key2=value2;等等，当然操作cookie可以通过document.cookie进行，然后我们所做的其实是文本分析，比如如何根据key获得等于号后面的value。

好了，下面的一篇文章我将会给大家展示一个例子，讲解Cookie的使用方法。