模板字符串
ES6提供了更方便处理字符串的方法
保留字符串格式
在ES6之前我们拼接字符串时如果遇到换行啊之类的多行字符串就得使用\n这样的换行标识来进行操作,如果不只是单纯的换行还有一些缩进啊之类的格式,那么就更难编写了,比如:
这是一段文字
这里空了两个字
这里也是
像这样的如果在js里就得这样写才能输出:
const a = '这是一段文字\n 这里空了两个字\n 这里也是 '
压根就不能直观地表现你要输出的是什么格式的字符串,只能凭想象去在一行文字内去写多行的字符串。如果想在编写的时候就按格式来,比如:
const a = '这是一段文字
这里空了两个字
这里也是'
这样是会报错的……
ES6提供的方法也很简单,只要把单引号或者双引号替换成 ` 包住就行,这个字符是英文状态下tab键上方的那个按键,被它包住的字符串里保留格式,就是说想换行想缩进啥的直接在输入时怎么舒服怎么来,比如上面的例子
const a = `这是一段文字
这里空了两个字
这里也是`
就这样直观的写就好了,会照着这格式输出。
字符串拼接时插入表达式
我们输出一个字符串时有时候会有一个需求,比如以下场景:张三带着N元钱去买百事可乐,假如我们要输出这一句话,且N是个变量,根据输入的数决定,以前是这么来的:
let N = prompt('张三带了多少钱?');
console.log('张三带着' + N + '元钱去买百事可乐');
就是用的拼接的方法,ES6中模板字符串结合上面的 ==`==标识可以很方便的做到这种带着表达式或者变量的字符串输出:
let N = prompt('张三带了多少钱?');
console.log(`张三带着${N}元钱去买百事可乐`);
就是在字符串中插入${},里面可以是任何正确的表达式,
console.log(`张三带着${1 + 8/4}元钱去买百事可乐`);