讓我們深入探討 JavaScript 中的兩種基本 Web 存儲機制：本地存儲和會話存儲。這兩種機制對于使用數(shù)據(jù)持久性創(chuàng)建個性化用戶體驗非常重要。它們都以服務(wù)器無法讀取的方式將數(shù)據(jù)存儲在用戶瀏覽器中。我們將深入研究兩者，解釋其用例以及它們之間的區(qū)別。

先決條件

1. javascript的應用知識
2. 網(wǎng)絡(luò)瀏覽器的應用知識

讓我們開始吧

什么是本地存儲？

本地存儲將鍵值對存儲在用戶的瀏覽器中。即使在用戶關(guān)閉瀏覽器或關(guān)閉設(shè)備后，這些存儲的數(shù)據(jù)也會保留。用戶可以手動清除瀏覽器緩存或直到應用程序清除數(shù)據(jù)，才能清除此數(shù)據(jù)。它有大約 5MB 的存儲容量，比 cookie 可以存儲的要大。

本地存儲非常適合存儲將在您的應用程序中經(jīng)常訪問的全局數(shù)據(jù)，例如用戶名、電子郵件、姓名等。它也非常適合記住我這樣的功能，可以通過跳過用戶已經(jīng)完成的步驟來幫助簡化用戶體驗之前輸入。

什么是會話存儲？

與本地存儲類似，會話存儲也在用戶的瀏覽器中存儲鍵值對。事實上，它們都是 Web 存儲 API 的一部分，不同之處在于它們的數(shù)據(jù)處理方式不同。它不是為多個會話保留數(shù)據(jù)，而是僅在其用戶的特定會話期間可用。這意味著當用戶關(guān)閉其瀏覽器或選項卡時，數(shù)據(jù)將被清除。這非常適合多步驟流程，例如預訂航班和酒店、購物車和用戶身份驗證。

本地存儲與會話存儲

讓我們比較一下兩者。您知道他們在數(shù)據(jù)持久化方面存在差異。它們還有哪些不同之處？首先，適用范圍不同。本地存儲在所有選項卡和窗口中具有全局范圍，而會話存儲僅限于其單個選項卡或窗口。本地存儲還具有更大的容量，這是有道理的，因為它可以在多個選項卡和窗口之間保存數(shù)據(jù)。

如果使用不當，這甚至可能會對性能產(chǎn)生影響?？紤]到它的大尺寸，如果使用不當，它可能會降低您的應用程序的速度，但是，這并沒有太大的不同。最重要的是選擇最適合您應用程序特定用例的場景。是否應該為多個會話保留數(shù)據(jù)？使用本地存儲。如果不是，請考慮會話存儲。

下一步

您如何使用本地或會話存儲來個性化您的應用程序的用戶體驗？去深入了解一下吧！您甚至可以通過查看如下所示的開發(fā)工具中的“應用程序”選項卡來查看應用程序如何執(zhí)行此操作

您以前使用過本地或會話存儲嗎？您在哪些用例中使用過它們？您正在考慮哪些用例？