本篇文章给大家带来的内容是关于es6字符串中新增知识介绍（代码示例），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。
es6字符串添加了很多新功能，当然也有很多关于字符串编码的一些学习性东西，在这里咱们就不多做介绍，介绍一下常用的一些方法
字符串的遍历接口
es6中字符串扩展了遍历器接口for(let i of 'abcdef'){ console.log(i) // a,b,c,d,e,f}其实看起来和其他的遍历长的挺像的，那我们来看看它是否除了能遍历字符串之外，还能否遍历其它类型呢那我们来试一下数组类型,会像我们预想的那样会得到遍历的值for(let i of [1,2,3]){ console.log(i) // 1,2,3}看一下对象的类型的遍历for(let i of {a:1,b:2}){ console.log(i) // 报错}
登录后复制
上面遍历对象是会报错的，因为for of 是不能直接枚举普通对象的，除非这个对象有Iterator接口才能使用，Iterator接口在这里就不多说了，以后的文章会对它进行讲解的
for of 循环遍历器还可以配合break(直接跳出) continue（跳出继续执行） return （在函数内使用）配合使用跳出循环for (let a of '123456') { if (a ==='1') { break } console.log(a) // 1}
登录后复制
有时间的话大家不妨可以试一下
字符串includes()，startsWith()，endsWith()方法
es5中提供了indexOf方法来确定查找的字符串是否在其中，现在又多了三个，是不是很开心！！！
includes方法返回布尔值，是否在字符串其中
let str = 'this is es6' str.includes('es6')// true 这个方法还支持第二个参数，那就是选择位置搜索，从0开始算，空格也会算位置,是从当前位置往后搜索，也算当前的位置 let str = 'this is es6' str.includes('i'， 5) // true 搜索多个也是可以的，当然如果位置超过es6的真实位置会查找不到 str.includes('es6', 5) // true
登录后复制
startsWith方法返回布尔值，是否在字符串的头部
let str = 'is heard' str.startsWith('is') // true str.startsWith('i') // true str.startsWith('is heard') // true str.startsWith('h') // false 上边的第三个为什么也算头部，在我看来因为把is heaed 看做了整体所以都算头部，而最后一个false是因为在is heard查找h所以h不算是头部 这个方法也是有第二个参数的 str.startsWith('i'， 0) // true str.startsWith('is'， 0) // true str.startsWith('is'， 1) // false
登录后复制
endsWith方法返回布尔值，是否在字符串的尾部
let str = 'is last' str.endsWith('t') //true str.endsWith('st') //true， str.endsWith('s') //false
登录后复制
其实这个和上边的方法startsWith差不多少只不过这个是查找的尾部，那个是查找的头部
repeat 重复返回一个新的字符串，重复多少次取决于你的参数
参数是 0 到-1 之间的小数，则等同于 0，-0也算0abc.repeat(3)// abcabcabc因为不能小于-1，才会报错'abc154789'.repeat(-1) //报错大于-1的话会被取整为0，所以会是空的字符串'abc154789'.repeat(-0.9999999999) //“”NaN也会被当做为0处理'NaN'.repeat(NaN) // ""参数也可以为字符串,但是也是空因为下面的字符串会被转为NaN'hhh'.repeat('cc') // ''
登录后复制
padStart()，padEnd()Es7的字符串自动补全功能
padStart 我们来先说一下头部补全'aa'.padStart(5, 'xc') // xcxaa'啊！'.padStart(4, '你好') // "你好啊！"'好看'.padStart(4, '你长得真') // "你长好看"'好看'.padStart(4) // " 看"上面的例子是第一个参数是5，表示要5个字符，第二个参数是补全的参数，从头部补全xcx,’aa‘是不会变的，当然倒数第二个第一个参数也算限制了文字，所以会从左到右选取剩余的长度，最后一个的话没有第二个参数会按四个空格我们来看看从后面补全，其实机制和从头部补全差不多，看一下例子'aa'.padEnd(5, 'xc') // aaxcx'啊！'.padEnd(4, '你好') // "啊！你好"
登录后复制
模板字符串
我们先来看一下什么是字符串模板,注意不要用单双引号，要用··，对就是那个
普通的字符串模板
·this is 啊啊啊啊·
多行文本的字符串模板
·哈哈哈，你好啊
我是哈哈·
变量的模板字符串
let a = '你好'${a}啊 // 你好啊let str = 'this is'${str}模板 // this is 模板
登录后复制
还可以使用函数，但是得把你需要的return出来
function add () { return 123}${add()}456 // 123456
登录后复制
模板编译
let a = `
登录后复制 `
上面会被输出为
登录后复制 0 1 2
我们再来看看下面这个,你们猜函数会执行吗
let html = `
5
4
3
2
` function add() { alert(123)}
登录后复制
String.raw字符串的模板
let s1 = 'qwe', s2 = '123' String.raw`${ s1 + s2 }` // qwe123 下面这种是左边的参数会被分为['h','e','l','l','o'],然后就是左边一个参数逗号右边一个开始补 String.raw（{raw: 'hello'}, 123）// h123ello 第二个参数为对象的话是不会被分解的哦 String.raw({ raw: 'hello' }, {aa: 'ooo'});"h[object Object]ello"
登录后复制
以上就是es6字符串中新增知识介绍（代码示例）的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2734364.html
