-------------------------------------------------------

一直以來，我所以為的 sessionStorage 的生命週期是這樣的：在 sessionStorage 中儲存的資料會在當前瀏覽器的同一網站的多個標籤頁中共享，並在此網站的最後一個標籤頁被關閉後清除。注意：這是錯誤的。

我之所以會這麼認為，是因為我寫程式碼的時候，sessionStorage 給我的表現就是這樣的。

假設我們有一個 index.html：

<!-- 使用一個新標籤頁開啟自身，並設定一個 sessionStorage -->
<a href="index.html" target="_blank" onclick="sessionStorage.setItem('j', 's')">
  open myself
</a>
 

接下來：

1. 在瀏覽器中開啟這個 index.html，我們稱之為標籤頁 A。注意：需要用 http 協議開啟！例如 http://localhost/index.html
2. 點選頁面上的連結，此時會彈出來標籤頁 B。
3. 在標籤頁 B 中開啟控制檯並執行 sessionStorage.getItem('j')

控制檯會輸出 's'，這說明標籤頁 A 和 B 共享了 sessionStorage 中的資料；接下來，先關閉這兩個標籤頁，然後再開啟一個標籤頁 C，再讀取一下 j 的值，得到的是 null。

這看起來跟本文一開始的說法是一致的，但今天我遇到了一個奇怪的事情……

我們給上面的步驟新增第四步

1. 在瀏覽器中開啟這個 index.html，我們稱之為標籤頁 A。注意：需要用 http 協議開啟！例如 http://localhost/index.html
2. 點選頁面上的連結，此時會彈出來標籤頁 B。
3. 在標籤頁 B 中開啟控制檯並執行 sessionStorage.getItem('j')，得到 's'
4. 新建一個新標籤頁 D，然後在位址列內輸入 http://localhost/index.html 開啟同樣的頁面， 然後執行 sessionStorage.getItem('j') 。

按照我的預期，標籤頁 D 得到的應該還是 's'，畢竟我認為 sessionStorage 的資料是在同一網站的多個標籤頁之間共享的。但是我錯了

發生了什麼？為什麼標籤頁 B 中得到的是 's'，為什麼標籤頁 D 中卻是 null？

細心的同學可能已經發現了，標籤頁 B 和標籤頁 D 之間唯一的不同就是它們被開啟的方式：標籤頁 B 是通過在標籤頁 A 中點選連結開啟的，但標籤頁 D 是在瀏覽器位址列輸入地址開啟的。

我趕緊上 MDN 查了一下，上面是這麼說的：

...data stored in sessionStorage gets cleared when the page session ends...Opening a page in a new tab or window will cause a new session to be initiated, which differs from how session cookies work.

所以現在我明白了：通過點選連結（或者用了 window.open）開啟的新標籤頁之間是屬於同一個 session 的，但新開一個標籤頁總是會初始化一個新的 session，即使網站是一樣的，它們也不屬於同一個 session。