js字符串截取函数slice、substring和substr的比较


Posted in Javascript onMay 17, 2016

在js中字符截取函数有常用的三个slice()、substring()、substr()了,下面我来给大家介绍slice()、substring()、substr()函数在字符截取时的一些用法与区别吧。

取字符串的三个函数:slice(start,[end]),substring(start,[end])和substr(start,[length])
相关属性:
slice()
第一个参数代表开始位置,第二个参数代表结束位置的下一个位置,截取出来的字符串的长度为第二个参数与第一个参数之间的差;若参数值为负数,则将该值加上字符串长度后转为正值;若第一个参数等于大于第二个参数,则返回空字符串.
substring()
第一个参数代表开始位置,第二个参数代表结束位置的下一个位置;若参数值为负数,则将该值转为0;两个参数中,取较小值作为开始位置,截取出来的字符串的长度为较大值与较小值之间的差.
substr()
第一个参数代表开始位置,第二个参数代表截取的长度
PS:字符串都从0开始计起
例子:

<script type="text/javascript">
   var stmp = "rcinn.cn";
   //使用一个参数
   alert(stmp.slice(3));//从第4个字符开始,截取到最后个字符;返回"nn.cn"
   alert(stmp.substring(3));//从第4个字符开始,截取到最后个字符;返回"nn.cn"
   //使用两个参数
   alert(stmp.slice(1,5))//从第2个字符开始,到第5个字符;返回"cinn"
   alert(stmp.substring(1,5));//从第2个字符开始,到第5个字符;返回"cinn"
   //如果只用一个参数并且为0的话,那么返回整个参数
   alert(stmp.slice(0));//返回整个字符串
   alert(stmp.substring(0));//返回整个字符串
   //返回第一个字符
   alert(stmp.slice(0,1));//返回"r"
   alert(stmp.substring(0,1));//返回"r"
   //在上面的例子中我们可以看出slice()和substring()的用法是相同的
   //返回的值也是一样的,但当参数为负数时,他们的返回值却不一样,看下面的例子
   alert(stmp.slice(2,-5));//返回"i"
   alert(stmp.substring(2,-5));//返回"rc"
   //从上面两个例子可以看出slice(2,-5)实际上是slice(2,3)
   //负5加上字符串长度8转换成正3(若第一位数字等于或大于第二位数字,则返回空字符串);
   //而substring(2,-5)实际上是substring(2,0),负数转换为0,substring总是把较小的数作为起始位置。
   alert(stmp.substring(1,5))//从第2个字符开始,到第5个字符;返回"cinn"
   alert(stmp.substr(1,5));//从第2个字符开始,截取5个字符;返回"cinn."
</script>

substr 和 substring方法的区别

<script type="text/javascript"> 
var str = "0123456789";// 
alert(str.substring(0));//------------"0123456789" 
alert(str.substring(5));//------------"56789" 
alert(str.substring(10));//-----------"" 
alert(str.substring(12));//-----------"" 
alert(str.substring(-5));//-----------"0123456789" 
alert(str.substring(-10));//----------"0123456789" 
alert(str.substring(-12));//----------"0123456789" 
alert(str.substring(0,5));//----------"01234" 
alert(str.substring(0,10));//---------"0123456789" 
alert(str.substring(0,12));//---------"0123456789" 
alert(str.substring(2,0));//----------"01" 
alert(str.substring(2,2));//----------"" 
alert(str.substring(2,5));//----------"234" 
alert(str.substring(2,12));//---------"23456789" 
alert(str.substring(2,-2));//---------"01" 
alert(str.substring(-1,5));//---------"01234" 
alert(str.substring(-1,-5));//--------"" 
alert(str.substr(0));//---------------"0123456789" 
alert(str.substr(5));//---------------"56789" 
alert(str.substr(10));//--------------"" 
alert(str.substr(12));//--------------"" 
alert(str.substr(-5));//--------------"0123456789" 
alert(str.substr(-10));//-------------"0123456789" 
alert(str.substr(-12));//-------------"0123456789" 
alert(str.substr(0,5));//-------------"01234" 
alert(str.substr(0,10));//------------"0123456789" 
alert(str.substr(0,12));//------------"0123456789" 
alert(str.substr(2,0));//-------------"" 
alert(str.substr(2,2));//-------------"23" 
alert(str.substr(2,5));//-------------"23456" 
alert(str.substr(2,12));//------------"23456789" 
alert(str.substr(2,-2));//------------"" 
alert(str.substr(-1,5));//------------"01234" 
alert(str.substr(-1,-5));//-----------"" 
</script>

函数:split()
功能:使用一个指定的分隔符把一个字符串分割存储到数组
例子:

str=”jpg|bmp|gif|ico|png”;
arr=theString.split(”|”);
//arr是一个包含字符值”jpg”、”bmp”、”gif”、”ico”和”png”的数组

函数:John()
功能:使用您选择的分隔符将一个数组合并为一个字符串
例子:

var delimitedString=myArray.join(delimiter);
var myList=new Array(”jpg”,”bmp”,”gif”,”ico”,”png”);
var portableList=myList.join(”|”);
//结果是jpg|bmp|gif|ico|png

 函数:indexOf()
功能:返回字符串中匹配子串的第一个字符的下标

var myString=”JavaScript”;
var w=myString.indexOf(”v”);w will be 2
var x=myString.indexOf(”S”);x will be 4
var y=myString.indexOf(”Script”);y will also be 4
var z=myString.indexOf(”key”);z will be -1

在网上看到另一种非常简单的方法,代码如下:

function func(s, n) {


return s.replace(/([^x00-xff])/g, “$1a”).slice(0, n).replace(/([^x00-xff])a/g, “$1″);

}

这个方法非常巧妙,而且基本上是正确的。说“基本上”是因为它在取“123汉字测试”左边长度为 6 的子串时,它返回的是“123汉字”,而不是“123汉”。当然,这也并不一定就是问题,某些情况下需求可能就是这样。这个方法还可以再改进一下,如下:

 function func(s, n) {

return s.slice(0, n).replace(/([^x00-xff])/g, “$1a”).slice(0, n).replace(/([^x00-xff])a/g, “$1″);

}

以上就是本文的全部内容,希望对大家学习javascript程序设计有所帮助。

Javascript 相关文章推荐
JavaScript静态的动态
Sep 18 Javascript
js 禁用只读文本框获得焦点时的退格键
Apr 25 Javascript
JavaScript不使用prototype和new实现继承机制
Dec 29 Javascript
Bootstrap开发实战之第一次接触Bootstrap
Jun 02 Javascript
AngularJS入门教程之Select(选择框)详解
Jul 27 Javascript
AngularJS中关于ng-class指令的几种实现方式详解
Sep 17 Javascript
Node.js查找当前目录下文件夹实例代码
Mar 07 Javascript
jQuery常见面试题之DOM操作详析
Jul 05 jQuery
微信小程序http连接访问解决方案的示例
Nov 05 Javascript
vue基础之使用get、post、jsonp实现交互功能示例
Mar 12 Javascript
如何提升vue.js中大型数据的性能
Jun 21 Javascript
Jquery让form表单异步提交代码实现
Nov 14 jQuery
javascript Promise简单学习使用方法小结
May 17 #Javascript
关于安卓手机微信浏览器中使用XMLHttpRequest 2上传图片显示字节数为0的解决办法
May 17 #Javascript
Web前端新人笔记之jquery入门心得(新手必看)
May 17 #Javascript
Angularjs中的事件广播 —全面解析$broadcast,$emit,$on
May 17 #Javascript
iScroll.js 使用方法参考
May 16 #Javascript
BootStrap的JS插件之轮播效果案例详解
May 16 #Javascript
老司机带你解读jQuery插件开发流程
May 16 #Javascript
You might like
php float不四舍五入截取浮点型字符串方法总结
2013/10/28 PHP
ThinkPHP CURD方法之table方法详解
2014/06/18 PHP
php通过curl添加cookie伪造登陆抓取数据的方法
2016/04/02 PHP
js类中获取外部函数名的方法与代码
2007/09/12 Javascript
深入剖析JavaScript中的枚举功能
2014/03/06 Javascript
AngularJS进行性能调优的7个建议
2015/12/28 Javascript
Bootstrap零基础入门教程(二)
2016/07/18 Javascript
Vue2单一事件管理组件通信
2017/05/09 Javascript
微信小程序实现锚点定位楼层跳跃的实例
2017/05/18 Javascript
基于Vue的SPA动态修改页面title的方法(推荐)
2018/01/02 Javascript
解决Mac安装thrift因bison报错的问题
2018/05/17 Javascript
Vue项目路由刷新的实现代码
2019/04/17 Javascript
百度小程序之间的页面通信过程详解
2019/07/18 Javascript
在Vue中使用Select选择器拼接label的操作
2020/10/22 Javascript
Python中让MySQL查询结果返回字典类型的方法
2014/08/22 Python
Python日志模块logging简介
2015/04/13 Python
Python写的一个简单监控系统
2015/06/19 Python
pyqt5简介及安装方法介绍
2018/01/31 Python
python标记语句块使用方法总结
2019/08/05 Python
tensorflow:指定gpu 限制使用量百分比,设置最小使用量的实现
2020/02/06 Python
Django ValuesQuerySet转json方式
2020/03/16 Python
Python中Selenium库使用教程详解
2020/07/23 Python
ASP.NET Core中的配置详解
2021/02/05 Python
Staples英国官方网站:办公用品一站式采购
2017/10/06 全球购物
俄罗斯购买剧院和演唱会门票网站:Parter.ru
2019/11/09 全球购物
Silk Therapeutics官网:清洁、抗衰老护肤品
2020/08/12 全球购物
生物科学专业个人求职信范文
2013/12/07 职场文书
实习生自我鉴定
2013/12/12 职场文书
关于护士节的演讲稿
2014/05/26 职场文书
班级文化标语
2014/06/23 职场文书
庆七一活动总结
2014/08/27 职场文书
2014年法院个人工作总结
2014/12/17 职场文书
公司内部升职自荐信
2015/03/27 职场文书
2015中秋节晚会开场白
2015/07/30 职场文书
导游词之长城八达岭
2019/09/24 职场文书
JavaScript 防篡改对象的用法示例
2021/04/24 Javascript