markberning
1/7/2018 - 11:07 AM

ES6 Template Literals

'This is a string' // string literal
"This is a string" // string literal

`This is a string. Notice the back ticks.` // template literal

const fruitList =
  "<ul>" +
    "<li>Kiwi</li>" +
    "<li>Lime</li>" +
    "<li>Pineapple</li>" +
  "</ul>";

const veggieList = `
  <ul>
    <li>Potato</li>
    <li>Pepper</li>
    <li>Leek</li>
  </ul>
`;

// Interpolation with Template Literals
>let name = 'Gary'
>`Hello, ${name}` // "Hello, Gary"
>`I'll be there at ${2 * 3} o'clack // "I'll be ther at 6 o'clack"

// These are the same
// const sentence = `<p>` + like(`apples`) + `, but ` + love(`oranges`) + `.</p>`;
const sentence = `<p>${like(`apples`)}, but ${love(`oranges`)}.</p>`;