本文对当前前端常用的本地存储方式进行一下概述行介绍。

    并不会过多涉及每一种存储方式的具体用法，具体可以参阅对应板块。

    一.本地存储概念：

    通俗的讲，本地存储就是web应用程序将数据存储在本地浏览器，也就是本地硬盘中。

    比如最佳最为熟悉的cookie，它是存储在硬盘某个位置文本文件中的一段字符串。

    从万维网诞生，随着需求的不断增加，本地存储的方式也逐渐呈现多样化。

    二.本地存储常见方式：

    （1）.cookie

    （2）.sessionStorage

    （3）.localStorage

    （4）.indexedDB

    （5）.WebSQL（不被推荐使用）

    上述几种存储方式，可以在谷歌开发者工具Application选项卡中看到。

    具体截图如下：

    a:3:{s:3:\"pic\";s:43:\"portal/201910/20/204218hj2q1oicejaqgvxq.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

    WebSQL是一种关系型数据库，功能强大，但是学习成本高。

    并且前端对于数据的存取没有太高的要求，所以被indexedDB数据库取代。

    三.存储方式用途简介：

    （1）.cookie：

    cookie最先诞生，它的主要用途是维护http会话状态。

    大家知道http协议是无状态的，两次请求是彼此独立的，cookie主要用于解决此问题。

    也可以用于存储一些简单的用户信息，存储量非常小，并且每次都会随着请求发送到服务器，浪费性能。

    （2）.Storage：

    sessionStorage和localStorage可以在本地存储更多的数据，并且不会发送到服务器。

    由于存储量的增加，应用范围更加广泛，比如可以存储一些不需要及时更新的信息，加快响应速度。

    并且由于不会发送到服务器，可以节省带宽。

    （3）.indexedDB：

    它的存储量更大，在理论上甚至可以认为没有上限。

    具有较为强大的查询能力，所以更加适合存储更大更为复杂的数据。