JavaScript 本地儲存

本文對當前前端常用的本地儲存方式進行一下概述行介紹。

並不會過多涉及每一種儲存方式的具體用法，具體可以參閱對應板塊。

一.本地儲存概念：

通俗的講，本地儲存就是web應用程式將資料儲存在本地瀏覽器，也就是本地硬碟中。

比如最佳最為熟悉的cookie，它是儲存在硬碟某個位置文字檔案中的一段字串。

從全球資訊網誕生，隨著需求的不斷增加，本地儲存的方式也逐漸呈現多樣化。

二.本地儲存常見方式：

（1）.cookie

（2）.sessionStorage

（3）.localStorage

（4）.indexedDB

（5）.Web SQL（不被推薦使用）

上述幾種儲存方式，可以在谷歌開發者工具Application選項卡中看到。

具體截圖如下：

Web SQL是一種關係型資料庫，功能強大，但是學習成本高。

並且前端對於資料的存取沒有太高的要求，所以被indexedDB資料庫取代。

三.儲存方式用途簡介：

（1）.cookie：

cookie最先誕生，它的主要用途是維護http會話狀態。

大家知道http協議是無狀態的，兩次請求是彼此獨立的，cookie主要用於解決此問題。

也可以用於儲存一些簡單的使用者資訊，儲存量非常小，並且每次都會隨著請求傳送到伺服器，浪費效能。

（2）.Storage：

sessionStorage和localStorage可以在本地儲存更多的資料，並且不會傳送到伺服器。

由於儲存量的增加，應用範圍更加廣泛，比如可以儲存一些不需要及時更新的資訊，加快響應速度。

並且由於不會傳送到伺服器，可以節省頻寬。

（3）.indexedDB：

它的儲存量更大，在理論上甚至可以認為沒有上限。

具有較為強大的查詢能力，所以更加適合儲存更大更為複雜的資料。