javascript ES6 - 里面有模板字符串循环的模板字符串

Posted 2021-05-04

const dogs = [
    { name: 'Snickers', age: 2 },
    { name: 'Hugo', age: 8 },
    { name: 'Sunny', age: 1 }
];

const markup = `
    <ul class="dogs">
        ${dogs.map(dog => `
            <li>
                ${dog.name}
                is
                ${dog.age * 7}
            </li>`).join('') // Add 'join' to remove the comma behind each item
        }
    </ul>
`;

document.body.innerHTML = markup;