[1]说一下对cookie和Storage(localStorage和sessionStorage) 的认识和区别？

1.看看他们在哪里

2.前端使用cookie和服务器种cookie

前端使用

后端使用

初始化一个express项目

npmiexpress-generator -g

express  项目根目录名称

换一个路径访问，发现url会携带cookie

3.localStorage和sessionStorage使用

这个就比较简单：

4.存储大小演示

var test = '0123456789'; 
var add = function (num) {           
    num += num;           
    if (num.length >= 10240) {                    
       test = num;    
       return;           
    }           
    add(num); 
 } 
    
    add(test); 
    var sum = test; 
    var show = setInterval(function () {             
        sum += test;             
    
        try {                       
           window.localStorage.removeItem('test');     
           window.localStorage.setItem('test', sum);
           console.log(sum.length / 1024 + 'KB');             
         } catch (e) {                         
            alert(sum.length / 1024 + 'KB超出最大限制');  
            clearInterval(show);             
         } 
  }, 20)

cookie不报错 ，但是我们可以看看cookie中最大存的数量：大概4kb

5.时效性演示

cookie:可以自定义

localStorage与sesstionStorage:

可以实验一下：设置后把浏览器tab关闭，后在打开，看看数据是否存在；甚至把浏览器都关闭

6.参考答案

SessionStorage, LocalStorage, Cookie这三者都可以被用来在浏览器端存储数据，而且都是字符串类型的键值对。

相同点

都存储在客户端

不同点

1、存储大小：

cookie数据大小不能超过4k。

sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大。

2、有效时间：

cookie ： 设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭；

localStorage ： 存储持久数据，浏览器关闭后数据不丢失除非主动删除数据；

sessionStorage ：数据在当前浏览器窗口关闭后自动删除。

3、数据与服务器之间的交互方式：

cookie的数据会自动的传递到服务器，服务器端也可以写cookie到客户端；

sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存；

4 使用上

cookie一般是后端在浏览器种cookie,后面所有的请求都会携带这个cookie

localstorage和sessionStorage主要提供前端在浏览器存储数据