ES6实用语法糖

  • 字符串扩展
  1. 字符串接口遍历器
for (let codePoint of 'foo') {
  console.log(codePoint)
}
// "f"
// "o"
// "o"

  2.模板字符串

    • 穿插变量

//
旧写法 $('#result').append( 'There are <b>' + basket.count + '</b> ' + 'items in your basket, ' + '<em>' + basket.onSale + '</em> are on sale!' ); //新写法 注意这里使用的是反引号 $('#result').append(` There are <b>${basket.count}</b> items in your basket, <em>${basket.onSale}</em> are on sale! `);
    • 换行
// 旧写法
`In JavaScript '
' is a line-feed.`

// 新写法   ---模板字符串表示多行字符串,所有的空格和缩进都会被保留在输出之中
`In JavaScript this is
 not legal.`
// 字符串和变量嵌套
const tmpl = addrs => `
  <table>
  ${addrs.map(addr => `
    <tr><td>${addr.first}</td></tr>
    <tr><td>${addr.last}</td></tr>
  `).join('')}
  </table>
`;
 
    •  标签模板
let a = 5;
let b = 10;
//  参数会被处理为两部分
// 1. 穿插的字符串组成的 字符串数组->['Hello ', ' world ', '']
// 2.中间变量依次作为函数的后续参数
tag`Hello ${ a + b } world ${ a * b }`;
// 等同于
tag(['Hello ', ' world ', ''], 15, 50);
  1.  
原文地址:https://www.cnblogs.com/cyh1282656849/p/12450346.html