ES6学习4章:字符串的扩展
程序员文章站
2022-03-08 22:20:28
...
一 、新增API
目前不常用的API
- at() ——识别Unicode编号大于0XFFFF的字符,返回正确的字符
- normalize() 将字符串的不同表示方法统一为同样的形式
- startWith() 返回boolean , 参数字符串是否在源字符串头部
- endWith() 返回boolean ,参数字符串是否在源字符串尾部
- repeat(n) 返回新字符串,表示将原字符串重复n次,n为>0数字,默认向下取整
- padStart(len,str) 用于头部补全str到最小长度len
- padEnd(len,str) 用于从尾部补全str到最小长度len
感觉有用的API
# includes() 返回布尔值,表示是否找到了参数字符串
var s = 'hello world';
s.includes('hello'); //true
模板字符串
- 反引号(`),加${}模板
- 作用:可以标识为普通字符串,可以标识多行字符串,可以在字符串中嵌入变量
- ${} 内可为模板字符串,可用JS运算,也可调用函数
- 注意:${}的{}内的值应该为字符串,如果不是字符串,将按照一般规则调用toString转为字符串
- 模板字符串可嵌套
var obj = {
name:'小明',
age:18
}
let tpl=`<div>${obj.name}今年${obj.18}岁了</div>`
$('#result').append(tpl)
# 调用函数
function fn(){
return 'hello world';
}
`foo${fn()} bar`
# {}不为字符串时
let obj = {name:'hele'}
let tpl = `hello ${obj}`
console.log(tpl) // hello [object object]
# 字符模板嵌套
let addrs = [
{first: '成都',last:'武侯区'},
{first: '成都',last:'青羊区'}
]
const tpl = addrs => `
<table>
${addrs.map(addr => `
<tr><td>${addr.first}</td></tr>
<tr><td>${addr.last}</td></tr>
`).join('')}
</table>
`
document.getElementById('box').innerHTML = tpl(addrs);
# 标签模板(跟在函数后)
alert`123` => alert(123)