BOM中如何操作瀏覽器的緩存？

bom不能直接操作瀏覽器的http緩存，但可以通過1.使用客戶端存儲(chǔ)（如localstorage）實(shí)現(xiàn)數(shù)據(jù)緩存；2.通過bom方法影響資源加載行為間接控制緩存。具體來說，localstorage可持久化存儲(chǔ)數(shù)據(jù)以提升性能和實(shí)現(xiàn)離線體驗(yàn)，常用方法包括setitem()存數(shù)據(jù)、getitem()取數(shù)據(jù)、removeitem()刪數(shù)據(jù)等。

BOM中如何操作瀏覽器的緩存？嗯，這個(gè)問題挺有意思的，因?yàn)樗悬c(diǎn)容易讓人產(chǎn)生誤解。我們平時(shí)說的瀏覽器緩存，大部分時(shí)候指的是HTTP緩存，那套機(jī)制主要是靠服務(wù)器發(fā)送的HTTP頭來控制的，比如Cache-Control、ETag這些。BOM（Browser Object Model）呢，它更多的是讓你能通過JavaScript去和瀏覽器窗口本身、歷史記錄、文檔位置這些東西打交道。所以，BOM并不能直接讓你去改動(dòng)瀏覽器底層的HTTP緩存策略。它能做的，更多是提供一些客戶端存儲(chǔ)的能力，讓你自己去“模擬”或者說“實(shí)現(xiàn)”一個(gè)緩存機(jī)制，再有就是通過一些方法去影響瀏覽器加載資源的行為，間接地觸及到緩存。

要說在BOM層面“操作”緩存，我們其實(shí)主要是在兩個(gè)維度上發(fā)力：一是利用BOM提供的客戶端存儲(chǔ)能力，把數(shù)據(jù)存在用戶本地，這就像是你自己搭了個(gè)小倉庫；二是利用BOM的一些方法，去影響瀏覽器在加載頁面或資源時(shí)是否使用它自己的HTTP緩存。

客戶端存儲(chǔ)：你的專屬“數(shù)據(jù)小倉庫”

這塊是BOM操作緩存的重點(diǎn)，也是我們最常用來實(shí)現(xiàn)前端性能優(yōu)化和離線體驗(yàn)的地方。

• localStorage：持久化存儲(chǔ)，不設(shè)保質(zhì)期。
  • 它就像一個(gè)沒有保質(zhì)期的貨架，你放上去的東西，只要用戶不手動(dòng)清理，就一直在那里。非常適合存儲(chǔ)用戶偏好設(shè)置、主題選擇、或者一些不經(jīng)常變動(dòng)的靜態(tài)數(shù)據(jù)，比如城市列表、商品分類等。
  • 存數(shù)據(jù)： localStorage.setItem(‘key’, ‘value’);
  • 取數(shù)據(jù)： let data = localStorage.getItem(‘key’);
  • 刪數(shù)據(jù)：