淺談JavaScript的Polymer框架中的behaviors對(duì)象
localStorage 應(yīng)是家喻戶曉的?但本地存儲(chǔ)這個(gè)家族可遠(yuǎn)不止它。以前扯過 sessionStorage,現(xiàn)在還有個(gè)神奇的 CacheStorage。它用來存儲(chǔ) Response 對(duì)象的。也就是說用來對(duì) HTTP ,響應(yīng)做緩存的。雖然 localStorage 也能做,但是它可能更專業(yè)。
CacheStorage 在瀏覽器上的引用名叫 caches 而不是駝峰寫法的 cacheStorage,它定義在 ServiceWorker 的規(guī)范中。CacheStorage 是多個(gè) Cache 的集合,而每個(gè) Cache 可以存儲(chǔ)多個(gè) Response 對(duì)象。
廢話不能說再多,下面是 demo
<script> caches.delete('c1'); caches.delete('c2'); Promise.all([ caches.open('c1').then(function(cache) { return cache.put('/hehe', new Response('aaa', { status: 200 })); }), caches.open('c2').then(function(cache) { return cache.put('/hehe', new Response('bbb', { status: 200 })); }) ]).then(function() { return caches.match('/hehe'); }).then(function(response) { return response.text(); }).then(function(body) { console.log(body); }); </script>
首先,在 caches 上調(diào)用 open 方法就可以異步地得到一個(gè) Cache 對(duì)象的引用。在這個(gè)對(duì)象上我們可以把 Response 對(duì)象 put 進(jìn)去(參數(shù)是一個(gè) URL 和一個(gè) Response 對(duì)象)、用 match 方法取出(傳入一個(gè) URL 取出對(duì)應(yīng)的 Response 對(duì)象)。
match 方法不僅可以在 Cache 上調(diào)用 CacheStorage 上也有 match 方法,比如上面例子就打開了兩個(gè) Cache,都寫入一個(gè)叫 /hehe 的 URL。在寫入操作完成之后,到外部的 CacheStorage 上調(diào)用 match 方法來匹配 /hehe,結(jié)果是隨機(jī)的(沒找到這個(gè)規(guī)則在哪里定義的)。
雖然上面的例子中只對(duì) Cache 對(duì)象 put 了一個(gè)數(shù)據(jù),而 Cache 對(duì)象本身可以存放更多的 URL/Response 對(duì)。并且提供了 delete(用戶刪除)、keys(用于遍歷)等方法。但是 Cache 并不像 localStorage 一樣有 clear 方法,如果非要清空一個(gè) Cache,可以直接在 CacheStorage 上把整個(gè) Cache 給 delete 掉再重新 open。
這套 API 和 ServiceWorker 一家的,它通常被用于 ServiceWorker 中,整個(gè)設(shè)計(jì)風(fēng)格也和 ServiceWorker 一樣都基于 Promise。
相關(guān)文章
Javascript typeof與instanceof的區(qū)別
JavaScript 中 typeof 和 instanceof 常用來判斷一個(gè)變量是否為空,或者是什么類型的。但它們之間還是有區(qū)別的,需要的朋友可以參考下2016-10-10JavaScript 入門·JavaScript 具有全范圍的運(yùn)算符
JavaScript 入門·JavaScript 具有全范圍的運(yùn)算符...2007-10-10jquery和javascript的區(qū)別(常用方法比較)
jquery 就對(duì)javascript的一個(gè)擴(kuò)展,封裝,就是讓javascript更好用,更簡(jiǎn)單,為了說明區(qū)別,下面與大家分享下JavaScript 與JQuery 常用方法比較2013-07-07JavaScript中二維數(shù)組的創(chuàng)建技巧
二維數(shù)組本質(zhì)上是以數(shù)組作為數(shù)組元素的數(shù)組,即"數(shù)組的數(shù)組",類型說明符 數(shù)組名[常量表達(dá)式][常量表達(dá)式]。二維數(shù)組又稱為矩陣,行列數(shù)相等的矩陣稱為方陣。對(duì)稱矩陣a[i][j] = a[j][i],對(duì)角矩陣:n階方陣主對(duì)角線外都是零元素2021-11-11javascript實(shí)現(xiàn)存儲(chǔ)hmtl字符串示例
這篇文章主要介紹了javascript實(shí)現(xiàn)存儲(chǔ)hmtl字符串示例,需要的朋友可以參考下2014-04-04javascript實(shí)現(xiàn)的圖片切割多塊效果實(shí)例
這篇文章主要介紹了javascript實(shí)現(xiàn)的圖片切割多塊效果,涉及javascript操作圖片及css樣式的技巧,需要的朋友可以參考下2015-05-05如何用ajax來創(chuàng)建一個(gè)XMLHttpRequest對(duì)象
如何創(chuàng)建ajax代理對(duì)象? 我知道怎么做~就是不清楚怎么用語(yǔ)言表達(dá)?本文將詳細(xì)介紹如何解決此問題2012-12-12