1. sessionStorage 

　　sessionStorage 方法針對一個 session 進行資料儲存。當用戶關閉瀏覽器視窗後，資料會被刪除。

　　用法： 

　　　　儲存： 1. 點（.）運算子                          sessionStorage.lastname = 'JSAnntQ';   

　　　　　　　 2. 方括號（[ ]）運算子                 sessionStorage['lastname'] = 'JSAnntQ';

　　　　　　　 3. localStorage.setItem　　　　  sessionStorage.setItem("lastname", "JSAnntQ");　

　　　　儲存： 1. 點（.）運算子                          sessionStorage.lastname  

　　　　　　　 2. 方括號（[ ]）運算子                 sessionStorage['lastname'] 

　　　　　　　 3. localStorage.getItem                sessionStorage.getItem("lastname");　

2. localStorage 

　　localStorage 方法儲存的資料沒有時間限制。第二天、第二週或下一年之後，資料依然可用。

　　用法： 

　　　　儲存： 1. 點（.）運算子                          localStorage.lastname = 'JSAnntQ';   

　　　　　　　 2. 方括號（[ ]）運算子                 localStorage['lastname'] = 'JSAnntQ';

　　　　　　　 3. localStorage.setItem　　　　  localStorage.setItem("lastname", "JSAnntQ");　

　　　　儲存： 1. 點（.）運算子                          localStorage.lastname  

　　　　　　　 2. 方括號（[ ]）運算子                 localStorage['lastname'] 

　　　　　　　 3. localStorage.getItem                localStorage.getItem("lastname");

3. vuex

　　Vuex 是一個專為 Vue.js 應用程式開發的狀態管理模式。它採用集中式儲存管理應用的所有元件的狀態，並以相應的規則保證狀態以一種可預測的方式發生變化。

　　用法： https://vuex.vuejs.org/zh/

4. 總結

1.區別：vuex儲存在記憶體，localstorage（本地儲存）則以檔案的方式儲存在本地,永久儲存；sessionstorage( 會話儲存 ) ,臨時儲存。localStorage和sessionStorage只能儲存字串型別，對於複雜的物件可以使用ECMAScript提供的JSON.stringify(obj)將其轉成字串，取出來時使用 JSON.parse(str)重新轉成物件。

2.應用場景：vuex用於元件之間的傳值，localstorage，sessionstorage則主要用於不同頁面之間的傳值。

3.永久性：當重新整理頁面（這裡的重新整理頁面指的是 --> F5重新整理,屬於清除記憶體了）時vuex儲存的值會丟失，sessionstorage頁面關閉後就清除掉了，localstorage不會。  

注：很多同學覺得用localstorage可以代替vuex, 對於不變的資料確實可以，但是當兩個元件共用一個數據源（物件或陣列）時，如果其中一個元件改變了該資料來源，希望另一個元件響應該變化時，localstorage，sessionstorage無法做到，原因就是區別1。

本文轉載自：https://www.cnblogs.com/jsanntq/p/9288144.html