JS的ES6模板字符串（拼接、变量、循环、函数）

拼接：反引号（`）

$('#ulList').html(`
    <ul>
      <li>浙江</li>
      <li>杭州</li>
    </ul>
`);

变量：用${ }

$('#ulList').html(`
    <ul>
      <li>${data.province}</li>
      <li>${data.city}</li>
    </ul>
`);

let x = 1;
let y = 2;
 
`${x} + ${y} = ${x + y}`
// "1 + 2 = 3"
 
`${x} + ${y * 2} = ${x + y * 2}`
// "1 + 4 = 5"
 
let obj = {x: 1, y: 2};
`${obj.x + obj.y}`
// "3"
 
//调用函数
function fn() {
  return "大连";
}
 
`I come from ${ fn() }`
//I come from 大连

循环

let template = `
<ul>
  <% for(let i=0; i < data.supplies.length; i++) { %>
    <li><%= data.supplies[i] %></li>
  <% } %>
</ul>
`;

函数

let script =
`(function parse(data){
  let output = "";
  function echo(html){
    output += html;
  }
  ${ template }
  return output;
})`;
 
return script;