字符串模版的出现让我们再也不用拼接变量了,而且支持在模板里有简单计算操作。
字符串模版
- ES5中的字符串拼接
let dk='吉他'
let blog = 'Nice to meet you '+dk+' 字符串模板'
document.write(blog)
- 字符串模版不再使用‘xxx’这样的单引号,而是换成了xxx这种形式,也叫连接号。这时我们再引用dukun变量就需要用${dk}这种形式了,我们对上边的代码进行改造。
let dk='吉他'
let blog = `Nice to meet you${dk}。字符串模板`
document.write(blog)
而且这里边支持html标签
let dk='吉他'
let blog = `<b>Nice to meet you</b>${dk}。</br>字符串模板`
document.write(blog)
对运算的支持
let a=1
let b=2
let result=`${a+b}`
document.write(result)
字符串查找
ES6增加字符串的查找功能,而且支持中文
- 查找是否存在:
ES5的写法 这种方法并不实用,给我们的索引位置,我们自己还要确定位置
let dk='吉他';
let blog = `Nice to meet you${dk}。字符串`;
document.write(blog.indexOf(dk)); // 网页中输出了16,我们还要自己判断。
ES6直接用includes就可以判断,不再返回索引值,这样的结果我们更喜欢,更直接。
let dk='吉他';
let blog = `Nice to meet you${dk}。字符串`;
document.write(blog.indexOf(dk)); // 网页中输出了true
- 判断开头是否存在:
blog.startsWith(dk); // no
- 判断结尾是否存在:
blog.endsWith(dk) // no
注意:starts和ends 后边都要加s
复制字符串
有时候需要字符串重复的,比如分隔符和特殊符号,这时候复制字符串就派上用场了,语法很简单。
document.write('吉他|'.repeat(3))