JS中本地存储的方式有哪些？

我目前了解到的本地存储的方式有以下四种:

1.localStorage

2.sessionStorage

3.cookie

4.indexedDB

注:因为indexedDB本身是一个数据库,操作复杂有一定难度,本人只是了解过一丝丝皮毛,但没有深入研究,在此就不做详细讨论了

接下来从以下几个方面说下它们的区别:

(1)存储数据的大小不同
localStorage和sessionStorage大概可以存5M左右的数据,不同的浏览器能存储的大小也不一样;

cookie能存的比较少,大概是4KB;

indexedDB能存储的数据是最多,理论上是没有上线的;

注:以上数据都是我查资料得来的,具体多少没有试过

(2)存储数据的类型不同

localStorage和sessionStorage是只能存入字符串，不能直接存对象;

cookie是键值对存储

indexedDB是存储大量结构化数据(包括, 文件/ blobs)

(3)存储数据的位置不同

localStorage是存在硬盘里面的;

sessionStorage是存在内存里的;

cookie是储存在用户本地终端上的;

indexedDB也是客户端存储

(4)存储数据的生命周期不同

localStorage是持久化的本地存储,关闭页面再打开数据依然还在,不会被主动清除,除非自己手动清除数据;

sessionStorage就不同了,它是关闭页面或者说是关闭会话,数据就会被清除;

cookie可以通过Expires属性设置一个过期时间,到时间就会被浏览器清除,在过期时间之前,即使是浏览器关闭,数据也一直有效

(5)数据和服务器之间的交互方式不同

在请求时，同源的cookie信息会自动作为请求头的一部分发给服务器,如果过多设置cookie，会额外增加通信负荷;

localStorage和sessionStorage就不会,因为仅仅只在本地保存,不会自动把数据放给服务器

在实际开发中，我会根据具体情况来选择使用它们。如果不需要与服务器通信并且可以长时间保存在客户端的信息就可以采用localstorage来保存，比如说：网站中提供的个人设置信息等;像敏感账号的一次性登录,我会用sessionStorage;如果需要标记用户和跟踪用户行为的情况,就比较推荐用cookie;最后像大量数据的存储、在线文档的保存编辑历史情况，用indexedDB比较合适

JS中本地存储的方式有哪些？相关推荐

详解Javascript本地存储的方式、区别及应用场景
详解Javascript本地存储的方式.区别及应用场景一.方式 javaScript本地缓存的方法我们主要讲述以下四种: cookie sessionStorage localStorage ind ...
浏览器本地存储的方式~~~~~
本地存储的方式:localStorage 和sessionStorage. 一.localStorage 1.特点:1.存储内容大小一般支持5MB左右(不同浏览器可能还不一样). ...
Js中的Sort排序方式
Js中的Sort排序方式这里只列出部分排序方式 1.Sort排序 Sort排序是数组内置函数,但他的排序是根据系统字符默认排序 //数组const arr = [3,4,2,3,123,35,65, ...
js清空本地存储_JS原理、方法与实践本地存储
本地存储就是指在浏览器中存储数据,是相对于服务器中存储数据来说的. 1. 本地存储的分类浏览器的本地存储主要包括4种方式:Cookie.Storage.SQL数据库和IndexedDB. Cooki ...
Javascript本地存储的方式有哪些？区别及应用场景？
# 一.方式 javaScript本地缓存的方法我们主要讲述以下四种: cookie sessionStorage localStorage indexedDB # cookie Cookie,类型为 ...
html5中本地存储概念是什么？
html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. sessionStorage用于本地存储一个会话中的数据,这些数据只有在同一个会话中的 ...
JS中的函数定义方式及全局函数
一.定义方式方式一用 function定义定义匿名函数,匿名函数可以被当作参数传递,不需要加入括号通过内置的function的对象创建函数 <!DOCTYPE html> <h ...
【JavaScript学习笔记2】JS中常见的输出方式-控制台输出信息
引言在编程开发的过程中,输出信息是非常必要的.JS中提供了四种输出方式:弹出显示框.控制台输出.弹出输入框.弹出判断显示框弹出显示框这种方式在上一篇笔记中已经详细介绍,有需要学习的朋友可以跳转到 ...
JS本地存储的方式？区别？应用？
一.四种存储方式: 1.cookie 不超过4kb 在过期时间之前一直有效,即使会话或者浏览器关闭会自动将数据传递到服务器,服务器也可以写cookie到客户端 2.localstorage 存储大小 ...

JS中本地存储的方式有哪些？

JS中本地存储的方式有哪些？相关推荐

最新文章

热门文章