NodeJS开发学习之JS本地保存数据的几种方法介绍

1.cookie

这个恐怕是最常见也是用得最多的技术了，也是比较古老的技术了。cookie优点很多，使用起来很方便

但它的缺点也很多：

比如跨域访问问题；无法保存太大的数据（最大仅为4kb）；本地保存的数据会发送给服务器，浪费带宽 等等；

代码如下

    function setcookie(name, value) {
        var key = '';
        var days = 2;
        var exp = new date();
        var domain = "";
        exp.settime(exp.gettime() + days * 24 * 60 * 60 * 1000);
        if (key == null || key == "") {
            document.cookie = name + "=" + encodeuri(value) + ";expires=" + exp.togmtstring() + ";path=/;domain=" + domain + ";";
        }
        else {
            var namevalue = getcookie(name);
            if (namevalue == "") {
                document.cookie = name + "=" + key + "=" + encodeuri(value) + ";expires=" + exp.togmtstring() + ";path=/;domain=" + domain + ";";
            }
            else {
                var keyvalue = getcookie(name, key);
                if (keyvalue != "") {
                    namevalue = namevalue.replace(key + "=" + keyvalue, key + "=" + encodeuri(value));
                    document.cookie = name + "=" + namevalue + ";expires=" + exp.togmtstring() + ";path=/;domain=" + domain + ";";
                }
                else {
                    document.cookie = name + "=" + namevalue + "&" + key + "=" + encodeuri(value) + ";expires=" + exp.togmtstring() + ";path=/;" + domain + ";";
                }
            }
        }
    }

    function getcookie(name) {
        var namevalue = "";
        var key = "";
        var arr, reg = new regexp("(^| )" + name + "=([^;]*)(;|$)");
        if (arr = document.cookie.match(reg)) {
            namevalue = decodeuri(arr[2]);
        }
        if (key != null && key != "") {
            reg = new regexp("(^| |&)" + key + "=([^(;|&|=)]*)(&|$)");
            if (arr = namevalue.match(reg)) {
                return decodeuri(arr[2]);
            }
            else return "";
        }
        else {
            return namevalue;
        }
    }

2.使用sessionstorage、localstorage

localstorage：

是一种你不主动清除它，它会一直将存储数据存储在客户端的存储方式，即使你关闭了客户端（)，属于本地持久层储存

sessionstorage：

用于本地存储一个会话（session）中的数据，一旦会话关闭，那么数据会消失，比如刷新。

有时候，我们需要将数据存储到sessionstorage和localstorage中，这样做的好处有：

1 缓存数据

2 减少对内存的占用

但是，storage只能存储字符串的数据，对于js中常用的数组或对象却不能直接存储。

它能保存更大的数据（ie8上是10mb，chrome是5mb），同时保存的数据不会再发送给服务器，避免带宽浪费。

localstorage存储方法（sessionstorage类似）

localstorage.name =’vanida；

localstorage[“name”]=’vanida’；

localstorage.setitem(“name”,”vanida”);

//这三种设置值方式是一样的；

localstorage获取值方法

var name = localstorage[“name”]

var name= localstorage.name

var name＝ localstorage.getitem(“name”);

//这三种获取值方式是一样的；

localstorage清除特定值方法

//清除name的值

localstorage.removeitem(“name”);

localstorage.name＝”;

localstorage清除所有值方法

localstorage.clear()

localstorage只能存储字符串，如果需要存储对象，首先要转化为字符串。利用json.stringify()；

var person = {name:”vanida”,”sex”:”girl”,”age”:25};

localstorage.setitem(“person”,json.stringify(person));

// localstorage.person=”{“name”:”vanida”,”sex”:”girl”,”age”:25}”

注意：json.stringify()中不要忘了“i”,stringify而不是stringfy！

然后取出person的对象你可以用json.parse();

person = json.parse(localstorage.getitem(“person”));

下面是单个简单的对象（数组类似）存贮，不考虑其他的多个的情况

var obj = { name:'jim' }; 
var str = json.stringify(obj); 

//存入 
sessionstorage.obj = str; 
//读取 
str = sessionstorage.obj; 
//重新转换为对象 
obj = json.parse(str);