Estoy usando este Array.map() para listar archivos en caché:
<div data-offline></div> <script> if (navigator && navigator.serviceWorker) { caches.open('pages').then(function (cache) { cache.keys().then(function (keys) { var offline = document.querySelector('[data-offline]'); offline.innerHTML = '<ul>' + keys.map(function(key) { return '<li><a href="' + key.url + '">' + key.url + '</a></li>'; }).join('') + '</ul>'; }); }); } </script>Esto enumera todo tipo de archivos en caché: html, js, css, imágenes, etc.
Pero me gustaría enumerar solo los archivos html. ¿Hay una manera de hacerlo?
Sí, hay una manera: además de map , que transforma elementos con la función dada, puede usar filter , que devuelve solo aquellos elementos donde la función dada devuelve verdadero.
Entonces usaría keys.map(f).filter(g).join('') en su ejemplo, donde f es su función de mapeo y g es su función que determina si un archivo es de tipo html.
Consulte https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/Array/filter .
Use Array.prototype.filter para excluir archivos antes de mapearlos
Ejemplo actualizado
"<ul>" + keys .filter(function (key) { return !key.url.endsWith(".html"); }) .map(function (key) { return '<li><a href="' + key.url + '">' + key.url + "</a></li>"; }) .join("") + "</ul>";