javascript基础——cookie组成、创建、获取、删除、cookie局限性、本地存储、session、sessionStorage与localStorage区别、闭包、闭包的特性、闭包的优缺点

cookie

cookie也叫HTTP Cookie，最初是客户端与服务器端进行会话使用的。比如，会员登录，下次回访网站时无须登录了；或者是购物车，购买的商品没有及时付款，过两天发现购物车里还有之前的商品列表。

HTTP Cookie要求服务器对任意HTTP请求发送Set-Cookie，因此，Cookie的处理原则上需要在服务器环境下进行。当然，现在大部分浏览器在客户端也能实现Cookie的生成和获取。

 cookie的组成

document.cookie = "uname=zhouran";

name=value; [expires=date]; [path=path]; [domain=somewhere.com]; [secure]

中括号是可选，name=value是必选。

expires=date 失效时间，如果没有声明，则为浏览器关闭后即失效。声明了失效时间，那么时间到期后方能失效。

var date = new Date();  //创建一个

date.setDate(date.getDate() + 7);

document.cookie = "user=xiaoming;expires=" + date.toUTCString;

如果要提前删除cookie也非常简单，只要重新创建cookie把时间设置当前时间之前即可：date.getDate() - 1或new Date(0)

path=path 访问路径，当设置了路径，那么只有设置的那个路径文件才可以访问cookie。

domain=domain 访问域名，用于限制只有设置的域名才可以访问，那么没有设置，会默认限制为创建cookie的域名。

var domain = ‘baidu.com';

document.cookie = "user= " + encodeURIComponent('小林') + ";domain=" + domain;

secure 安全设置，指明必须通过安全的通信通道来传输(HTTPS)才能获取cookie。

document.cookie = "user=zeng;secure";

创建cookie 

 function set(uname, uvalue, exdays) {
        var coo = uname + "=" + uvalue;
        if (exdays > 0) {
            var da = new Date();
            da.setTime(da.getTime() + exdays * 60 * 1000);
            coo.cookie += ";expires=" + da.toUTCString();
        }
        document.cookie = coo;
 }
 set("user", "zr", 1);

获取cookie 

方法一：  
function get(cname) {
        var cookieText = document.cookie;
        if (cookieText.indexOf(cname + "=") != -1) {
            var i = cookieText.indexOf(cname + "=");
            var start = i + cname.length + 1;
            var end = cookieText.indexOf(";", i);
            if (end == -1) {
                end = cookieText.length;
            }
            return cookieText.substring(start, end);
        }
  }
  console.log(get("user"));

方法二：
 function get(cname) {
        var cookieText = document.cookie;
        var arr = cookieText.split(";");
        for (var i = 0; i < arr.length; i++) {
            var item = arr[i].trim();//去空格
            if (item.indexOf(cname + "=" == 0)) {
                var start = cname.length + 1;
                var end = item.length;
                return item.substring(start, end);
            }
        }
        return "";
  } 

删除cookie 

function del(cname) {
        document.cookie = cname + "=;expires=" + new Date(0);
 }
 del("user");

 cookie局限性

第一：每个特定的域名下最多生成20个cookie（根据不同的浏览器有所区别）。

           1.IE6或更低版本最多20个cookie

           2.IE7和之后的版本最多可以50个cookie。IE7最初也只能20个，之后因被升级不定后                增加了。

           3.Firefox最多50个cookie

           4.Opera最多30个cookie

           5.Safari和Chrome没有做硬性限制。

为了更好的兼容性，所以按照最低的要求来，也就是最多不得超过20个cookie。当超过指定的 cookie时，浏览器会清理掉早期的cookie。IE和Opera会清理近期最少使用的cookie，Firefox会随机清理cookie。

第二：cookie的最大大约为4096字节(4k)，为了更好的兼容性，一般不能超过4095字节即可。

第三：cookie存储在客户端的文本文件，所以特别重要和敏感的数据是不建议保存在cookie的。比如银行卡号，用户密码等。

第四： cookie 会把数据发送到服务端  有些会造成不必要的带宽浪费。cookie 不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使 cookie 速度很慢而且效率也不高。

Cookie通过在客户端记录信息确定用户身份，Session通过在服务器端记录信息确定用户身份。`

cookie 和session 的区别：

1、cookie数据存放在客户的浏览器上，session数据放在服务器上。

2、cookie不是很安全，别人可以分析存放在本地的COOKIE并进行COOKIE欺骗

     考虑到安全应当使用session。

3、session会在一定时间内保存在服务器上。当访问增多，会比较占用你服务器的性能

     考虑到减轻服务器性能方面，应当使用COOKIE。

4、单个cookie保存的数据不能超过4K，很多浏览器都限制一个站点最多保存20个cookie。

5、所以个人建议：

     将登陆信息等重要信息存放为SESSION

     其他信息如果需要保留，可以放在COOKIE中

本地存储 

存储

localStorage.setItem('name', '小林');

alert(localStorage.getItem('name'))

获取

localStorage.book = '小林';

alert(localStorage.book);

删除

localStorage.removeItem('name');

清除所有

localStorage.clear();

localStorage保存在缓存里，只有手工删除或者清理浏览器缓存方可失效。在容量上也有一些限制，主要看浏览器的差异，Firefox3+、IE8+、Opera为5M，，Chrome和Safari为2.5M。

session 

设置

sessionStorage.setItem(key,value)
sessionStorage.key=value

获取
sessionStorage.getItem(key)
sessionStorage.key

删除一条数据
sessionStorage.removeItem(key)

删除所有数据
sessionStorage.clear( )

 sessionStorage与localStorage的区别

sessionStorage： session即会话的意思，在这里的session是指用户浏览某个网站时，从进入网站到关闭网站这个时间段，session对象的有效期就只有这么长。

sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后，数据会被删除。

localStorage： 将数据保存在客户端硬件设备上，不管它是什么，意思就是下次打开计算机时候数据还在。

localStorage 方法存储的数据没有时间限制。第二天、第二周或下一年之后，数据依然可用。

两者区别就是一个作为临时保存，一个长期保存。

闭包 Closure

一个函数和对其周围状态(lexical environment，词法环境)的引用捆绑在一起(或者说函数被引用包围)，这样的组合就是闭包(closure)。也就是说，闭包让你可以在一个内层函数中访问到其外层函数的作用域。在JavaScript中，每当创建一个函数，闭包就会在函数创建的同时被创建出来。

简而言之，闭包是指有权访问另一个函数作用域中变量的函数。

闭包的特性 

• 1.函数嵌套函数
• 2.函数内部可以引用外部的参数和变量
• 3.参数和变量不会被垃圾回收机制回收

闭包的优点和缺点 

优点：
1.变量被保存起来没有被销毁，随时可以被调用
2.只有函数内部的子函数才能读取局部变量,可以避免全局污染

3.私有成员的存在

缺点：
如果闭包使用不当，就会导致变量不会被垃圾回收机制回收，造成内存泄露

常驻内存，增加内存使用量