De hecho, estoy tratando de representar un HTMLElement usando cadenas de plantilla. La función va así
function renderContent(){ return `<div class="card"> <span>Content goes here</span> <ul class="list"> ${renderList()} </ul> </div>` } Y la función renderList() es así
function renderList() { const valueWithCount = { a : 1, b: 0, c:0, d:1} return Object.entries(valueWithCount).map(([key, value]) => { return `<li> <span class="key">${key}:</span> <span class="value">${value}</span> </li>`; }); }Quiero que el contenido se represente como
Content goes here a:1 d:1 No quiero representar las propiedades con valor 0. Podría escribir value && (some HTML content) . Pero como está dentro de la cadena de la plantilla, incluso se imprime 0. Si voy con value ? some content : null , el comportamiento es el mismo. El mismo caso con indefinido también.
¿Cómo evito esto?
Use .filter() en lugar de .map() :
function renderList() { const valueWithCount = { a : 1, b: 0, c:0, d:1} return Object.entries(valueWithCount).filter(([key, value]) => { if(value !== 0) return `<li> <span class="key">${key}:</span> <span class="value">${value}</span> </li>`; return null; }); } return null en otros casos.