模板字符串(template strings)
ES6 中引进的一种新型的字符串字面量语法 - 模板字符串。书面上来解释,模板字符串是一种能在字符串文本中内嵌表示式的字符串字面量。简单来讲,就是增加了变量功能的字符串。
ES6为我们提供了模板字符串,语法使用反引号`。模板字符串具有以下三个优点:
基本语法
模板字符串和 ES5的字符串的声明一样。
// ES5 var name = 'xixi'; console.log(name);// xixi // ES6 let name4ES6 = `一步`; console.log(name4ES6);// 一步
多行文本
在Jquery 盛行的年代,我们经常会拼接 html 片段再进行节点替换。写一段 ES5的代码大家体会一下:
var str = '<html>' + '<div>啦拉拉</div>' + '<div>xixixi</div>' + '</html>'; console.log(str);// <html><div>啦拉拉</div><div>xixixi</div></html>
ES6支持多行文本,上面的代码实现起来就容易多了。
let str4ES6 = `<html> <div>啦拉拉</div> <div>xixixix</div> </html>`; console.log(str4ES6);
可以插入变量或表达式
// ES5 var name = 'xixi'; var age = 27; var info = 'my name is ' + name + ' , age is ' + age + '.'; console.log(info);// my name is xixi , age is 27.
ES6的模板字符串实现起来就容易好多。关键语法${},其中可以插入任何的 js 表达式。
let name = 'xixi'; let age = 27; let info = `my name is ${name}, my age is ${age}. just a test ${1 + 10}!`; console.log(info);// my name is xixi, my age is 27. just a test 11!
总结
ES6模板字符串就是这么的简单这么的好用。
好了,以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对小牛知识库的支持。
本文向大家介绍ES6学习教程之对象字面量详解,包括了ES6学习教程之对象字面量详解的使用技巧和注意事项,需要的朋友参考一下 前言 本文主要给大家介绍了关于ES6对象字面量的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧。 ECMAScript6使得声明对象字面量更加简单,提供了属性简写和方法简写功能,属性名计算的新特性。 如果可以理解上述三个新特性,可以不必往下阅读。下面
ES6引入了一种通过反引号( ` )标记的新的字符串文字类型。 这些字符串文字可以包括换行符,并且有一个新的机制用于将变量插入字符串:
本文向大家介绍Python3字符串学习教程,包括了Python3字符串学习教程的使用技巧和注意事项,需要的朋友参考一下 字符串类型是python里面最常见的类型,是不可变类型,支持单引号、双引号、三引号,三引号是一对连续的单引号或者双引号,允许一个字符串跨多行。 字符串连接:前面提到的+操作符可用于字符串连接,还可以直接把几个字符串连在一起写,另外调用join()方法也可以连接字符串。 只适用于字
问题内容: 我有以下Ecma-Script-6代码 输出如下: 和 我已经能够在此处将字符串串联起来,那么使用模板文字的情形将是什么? 问题答案: 如果像问题示例中那样仅将模板文字与占位符(例如)一起使用,则结果与串联字符串相同。从主观上讲,它看起来更好并且更易于阅读,尤其是对于多行字符串或包含这两者的字符串,因为您不必再转义那些字符了。 可读性是一个很棒的功能,但是关于模板最有趣的是Tagg
我有以下ECMAScript 6模板文字的代码: 输出如下所示: 这是小提琴。 我试图寻找确切的区别,但我找不到,以下两种说法有什么区别? 和 我已经能够在这里获得与< code>person.name连接的字符串< code>MyVar,那么在什么场景中使用模板文字呢?
本文向大家介绍深入浅出es6模板字符串,包括了深入浅出es6模板字符串的使用技巧和注意事项,需要的朋友参考一下 本文主要介绍了深入浅出es6模板字符串,分享给大家,具体如下 作为前端开发者避免不了根据后台数据的返回,组装html,渲染页面。举个栗子 有时候还要给标签加一些属性,写起来很不方便,es6提供了模板字符串的方法,简化了这一过程 所有模板字符串的空格和换行,都是被保留的,如果你不想要前后换