JavaScript之存储

Posted 2021-12-30 精通各种hello world的小希

cookie

概念

        cookie是浏览器存储数据的一种方式，是本地存储，一般会自动随着浏览器每次请求发送到服务器端，最初是用来存储web中的状态信息，也就是说用于浏览器和服务端之间的通信，在html5之前借用来做本地存储。

        利用 Cookie 跟踪统计用户访问该网站的习惯，比如什么时间访问，访问了哪些页面，在每个网页的停留时间等。

 演示

1.一开始document.cookie是啥也没有，我们需要追加数据

2.我们可以通过document.cookie = '字符串'来写入cookie

3.读取的是一个由名值对构成的字符串，每个名值对之间由“; ”（一个分号和一个空格）隔开

4.如果名相同，值不同，则会覆盖前者

 我们可以通过浏览器来查看写入的信息

 我们也可以查看Network来查看给服务端发送的信息

 缺点

其实cookie用来做本地存储，有点像古人所说的“狗拿耗子，多管闲事”

1.每个 Cookie 的存储容量很小，最多只有 4KB 左右

2.http请求时需要发送到服务器端，增加请求的数据量

3.只能用document.cookie = "xxx" 来修改

localStorage/sessionStorage

这两种存储方式不同与cookie，它们就是为存储而生的

优点

1.HTML5专门为存储而设计的，最大可存5M

2.API简单易用 例如：setItem、getItem

3.不会随着http请求发送出去

 我们可以通过浏览器来查看写入的信息

 sessionSorage的API也一样

注意事项：

存储的键和值只能是字符串类型，不是字符串类型，也会先转化成字符串类型再存进去

  sessionSorage和localSorage的区别：

sessionSorage是会话存储，浏览器关闭则会清空

localSorage的数据是永久存储的，除非代码或手动删除

---

 今天写的内容不多，主要是提供给初学者了解浏览器的存储相关知识，如果需要学习更多丰富API操作和属性，可以去浏览一下其他优秀博主的博客。

今天你学废了吗？