ES6中字符串string常用的新增方法小结


Posted in Javascript onNovember 07, 2017

本文实例讲述了ES6中字符串string常用的新增方法。分享给大家供大家参考,具体如下:

ES6为js新增了很多方法,包括遍历、查询、替换等等,可以很简洁的替换ES5中的类似方法,本文不考虑codePointAt等不常用方法。

for…of:

let str="wbiokr";
for(let s of str){
  console.log(s)
}
//结果:w, b, i, o, k, r

由于es5并没有为js制定字符串相关遍历方法,for…of无疑会是接下来前端开发中的一个很重要角色。

includes:

let str="wbiokr";
str.includes('wb');//结果:true
str.includes('wbiokr');//结果:true
str.includes('w',1);//false
str.includes('b',1);//true

string.includes(s,i)方法参数1为需要查询字符(串),参数2为查询的起始位置,返回布尔值,而indexOf返回查询的位置。

startsWith:

let str="wbiokr";
str.startsWith('wb');//结果:true
str.startsWith('w');//结果:true
str.startsWith('w',1);//结果:false
str.startsWith('b',1);//true
str.startsWith('kr');//结果:false

string.startsWith(s,i)方法参数1为需要查询字符(串),参数2为查询的起始位置,返回布尔值,表示是否字符(串)位于string的头部位置。

endsWith:

let str="wbiokr";
str.endsWith('kr');//结果:true
str.endsWith('r');//结果:true
str.endsWith('wb');//结果:false
str.endsWith('i',6);//false
str.endsWith('i',3);//false
str.endsWith('kr',6);//true

string.endsWith()方法参数1为需要查询字符(串),参数2为查询的起始位置,返回布尔值,表示是否字符(串)位于string的尾部位置。

repeat:

let str="wbiokr";
str.repeat(2);//wbiokrwbiokr"str被重复了2次返回,str不改变
'hi'.repeat(3);//"hihihi"
'hi'.repeat(2.6);//'hihi'浮点类型参数,会取整重复
'hi'.repeat(0);//''0的时候返回空字符串
'hi'.repeat(-3)//负数,报错
'hi'.repeat(undefined)//''undefined转化为0
'hi'.repeat(null)//''null转化为0
'hi'.repeat(NaN)//''NaN转化为0

string.repeat(num)方法,参数num为重复字符串的次数,各种情况下的返回值见代码。

${} :

let str="wbiokr";
$('#box').html('
  there is a word ${str},i know it
');
//there is a word wbiokr,i know it

开发过程中,经常用到jq为元素动态添加子元素或动态添加内容,过去我们都是通过字符串拼接进行添加变量。ES6添加的 可以很好的取代jq的老方法,单引号加上'${}'不仅可以嵌入变量,还能保持代码格式,并且{}里面可以进行js代码运行。

更多相关内容可查看本站专题:《ECMAScript6(ES6)入门教程》、《JavaScript数组操作技巧总结》、《JavaScript字符与字符串操作技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript错误与调试技巧总结》及《javascript面向对象入门教程》

希望本文所述对大家基于ECMAScript的程序设计有所帮助。

Javascript 相关文章推荐
jQuery表单验证插件formValidator(改进版)
Feb 03 Javascript
js+JQuery返回顶部功能如何实现
Dec 03 Javascript
兼容IE和Firefox火狐的上下、左右循环无间断滚动JS代码
Apr 19 Javascript
鼠标移入移出事件改变图片的分辨率的两种方法
Dec 17 Javascript
javascript格式化json显示实例分析
Apr 21 Javascript
谈一谈js中的执行环境及作用域
Mar 30 Javascript
Sea.JS知识总结
May 05 Javascript
详解Node.js实现301、302重定向服务
Apr 07 Javascript
Angularjs自定义指令实现分页插件(DEMO)
Sep 16 Javascript
JS实现的简单表单验证功能示例
Oct 13 Javascript
EasyUI实现下拉框多选功能
Nov 07 Javascript
微信小程序实现团购或秒杀批量倒计时
Nov 01 Javascript
ES6中数组array新增方法实例总结
Nov 07 #Javascript
vue组件父子间通信详解(三)
Nov 07 #Javascript
浅谈ES6 模板字符串的具体使用方法
Nov 07 #Javascript
微信小程序上传图片到服务器实例代码
Nov 07 #Javascript
解决Vue使用mint-ui loadmore实现上拉加载与下拉刷新出现一个页面使用多个上拉加载后冲突问题
Nov 07 #Javascript
vue组件间通信子与父详解(二)
Nov 07 #Javascript
原生JS实现 MUI导航栏透明渐变效果
Nov 07 #Javascript
You might like
php面向对象的方法重载两种版本比较
2008/09/08 PHP
使用cookie实现统计访问者登陆次数
2013/06/08 PHP
Function eregi is deprecated (解决方法)
2013/06/21 PHP
Zend Framework实现Zend_View集成Smarty模板系统的方法
2016/03/05 PHP
PHP filter_var() 函数, 验证判断EMAIL,URL等
2021/03/09 PHP
用JavaScript 处理 URL 的两个函数代码
2007/08/13 Javascript
functional继承模式 摘自javascript:the good parts
2011/06/20 Javascript
node.js 一个简单的页面输出实现代码
2012/03/07 Javascript
基于jquery DOM写的类似微博发布的效果
2012/10/20 Javascript
jquery中文乱码的多种解决方法
2013/06/21 Javascript
JS小功能(setInterval实现图片效果显示时间)实例代码
2013/11/28 Javascript
JS实现为表格动态添加标题的方法
2015/03/31 Javascript
webpack+vue.js快速入门教程
2016/10/12 Javascript
jQuery实现表格与ckeckbox的全选与单选功能
2016/11/24 Javascript
图片上传之FileAPI与NodeJs
2017/01/24 NodeJs
Angular2入门教程之模块和组件详解
2017/05/28 Javascript
解决JS内存泄露之js对象和dom对象互相引用问题
2017/06/25 Javascript
input file样式修改以及图片预览删除功能详细概括(推荐)
2017/08/17 Javascript
使用classList来实现两个按钮样式的切换方法
2018/01/24 Javascript
详解webpack-dev-server的简单使用
2018/04/02 Javascript
详解vuex结合localstorage动态监听storage的变化
2018/05/03 Javascript
vue中Axios的封装与API接口的管理详解
2018/08/09 Javascript
如何封装了一个vue移动端下拉加载下一页数据的组件
2019/01/06 Javascript
vue中v-show和v-if的异同及v-show用法
2019/06/06 Javascript
对TypeScript库进行单元测试的方法
2019/07/18 Javascript
JavaScript检测浏览器是否支持CSS变量代码实例
2020/04/03 Javascript
如何利用node转发请求详解
2020/09/17 Javascript
在Python中使用filter去除列表中值为假及空字符串的例子
2019/11/18 Python
Python线程障碍对象Barrier原理详解
2019/12/02 Python
django使用F方法更新一个对象多个对象字段的实现
2020/03/28 Python
VS2019+python3.7+opencv4.1+tensorflow1.13配置详解
2020/04/16 Python
python获取响应某个字段值的3种实现方法
2020/04/30 Python
详解html5 canvas 微信海报分享(个人爬坑)
2018/01/12 HTML / CSS
《世界多美呀》教学反思
2014/03/02 职场文书
乡镇消防安全责任书
2014/07/23 职场文书
Redis可视化客户端小结
2021/06/10 Redis