ES6-模版字符串


一、 模版字符串

用反引号(`)来标识起始,用${}来引用变量,而且所有的空格和缩进都会被保留在输出之中。

let apple="苹果",banana='香蕉';
let fruit = "今天的水果是" + apple + '和' + banana + "!";
console.log(fruit);  //输出:今天的水果是苹果和香蕉!
let es6fruit = `今天的水果是 ${apple} 和 ${banana} !`;
console.log(es6fruit);  //输出:今天的水果是苹果和香蕉!
二、 带标签的模版字符串

Tagged Templates 就是带标签的模板,我们在模板字符串的前面添加一个标签(可以看做一个函数),这个标签可以去处理模板字符串里的字符,还有插入的变量值。

let fruitinfo = (strings,...values) => {
  console.log(strings,values);  //输出:[今天的水果是,和,!]  [苹果,香蕉]
  let result = '';
  for(let i = 0;i < values.length;i++){
    result = result + strings[i] + values[i];
  };
  result += strings[strings.length-1];
  console.log(result);  //输出:今天的水果是 苹果 和 香蕉 !
}
let apple="苹果",banana='香蕉';
let fruits = fruitinfo`今天的水果是 ${apple} 和 ${banana} !`;

为了最好的结果,让我们把疯狂进行到底。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 初探ES6:字符串模板 && 标签模板 关键词:``,${} 字符串模板: 在ES6之前我们要在html或者con...
    chenshuwen阅读 235评论 0 0
  • 前言 早些年的数据交互通常是用模板引擎或是拼字符串的方式 输出模板,这种方案相当繁琐而不方便,ES6引入了 模板字...
    王阿王阅读 545评论 0 0
  • 字符的 Unicode 表示法 codePointAt() String.fromCodePoint() 字符串的...
    卞卞村长L阅读 783评论 0 0
  • ES6加强了对Unicode的支持,并且扩展了字符串对象。 字符的Unicode表示法: JavaScript允许...
    呼呼哥阅读 797评论 0 0
  • 今夜,为了你的赴约我刻意谋划良久江边的罗斯福餐厅与那年的塞纳河畔很像 我点了澳洲和牛牛扒波士顿蛤蜊浓汤、还有红酒最...
    王子魚阅读 1,327评论 24 47