于哥：作为前段工程师，最近有一段面试被问到cookie、sessionStorage和localStorage的之间有什么区别？

其实他们都是储存浏览器数据的，一个cookie是随HTTP事务一起被发送的，因此会浪费一部分发送cookie时使用的带宽，一个Web Storage浏览器数据，有分为localStorage和sessionStorage。

相同点：
cookie、sessionStorage和localStorage都用在客户端存储数据，每一个都有自己的存储和到期限制

不同点：
一、存储大小

cookie数据大小不能大于4K；
localStorage和sessionStorage则可以达到5M

二、有效时间

具体来说，Web Storage又分为两种：

1.sessionStorage：将数据保存在session对象中。所谓session，是指用户在浏览某个网站时，从进入网站到浏览器关闭所经过的这段时间，也就是用户浏览这个网站所花费的时间。session对象可以用来保存在这段时间内所要求保存的任何数据。

2.localStorage：将数据保存在客户端本地的硬件设备(通常指硬盘，也可以是其他硬件设备)中，即使浏览器被关闭了，该数据仍然存在，下次打开浏览器访问网站时仍然可以继续使用。

这两者的区别在于，sessionStorage为临时保存，而localStorage为永久保存。

总结：

cookie在设置的有效期内一直有效；
localStorage存储持久数据，只要不手动清除则一直存在；
sessionStorage数据在当前浏览器关闭后就会被自动清除

三、数据与服务器间的交互方式

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

localStorage和sessionStorage不会把数据自动传到服务器端，仅在本地存储

转自知乎 终端研发部