js substr、substring和slice使用说明小记


Posted in Javascript onSeptember 15, 2011

关于substr、substring和slice方法区别的文章,网上搜到了许多,文章内容也基本一致。而后,我将其中一篇文章中的代码挪到本地进行了测试,发现测试结果和原文中的有些出入。

我更相信自己亲自验证过后的代码,随后小记下来,供以后查阅。

substr

document.write("|" + str.substr(0,5) + "|" + "<br />"); 
document.write("|" + str.substr(0) + "|" + "<br />"); 
document.write("|" + str.substr(5,1) + "|" + "<br />"); 
document.write("|" + str.substr(-5,2) + "|" + "<br />"); 
document.write("|" + str.substr(-2,-5) + "|" + "<br />");

打印效果

|12345|
|123456|
|6|
IE: |12| Chrome: |23|

substring

document.write("|" + str.substring(0,5) + "|" + "<br />"); 
document.write("|" + str.substring(0) + "|" + "<br />"); 
document.write("|" + str.substring(5,1) + "|" + "<br />"); 
document.write("|" + str.substring(-5,2) + "|" + "<br />"); 
document.write("|" + str.substring(-2,-5) + "|" + "<br />"); 
document.write("|" + str.substring(2,-5) + "|" + "<br />");

打印效果
|12345|
|123456|
|2345|
|12|

|12|
slice

document.write("|" + str.slice(0,5) + "|" + "<br />"); 
document.write("|" + str.slice(0) + "|" + "<br />"); 
document.write("|" + str.slice(5,1) + "|" + "<br />"); 
document.write("|" + str.slice(-5,2) + "|" + "<br />"); 
document.write("|" + str.slice(-2,-5) + "|" + "<br />"); 
document.write("|" + str.slice(2,-5) + "|" + "<br />");

打印效果
|12345|
|123456|

|2|

||
如果你预想的结果和打印效果完全一致,那你的基本功一定不赖。如果多少有点犹豫或者结果出乎你的意料,那我的文章多少也有点用处了。

总结

substr

该方法的arg2和其它两个方法的arg2压根就代表不同意义,所以单独揪出来。

当arg1<0时,不同浏览器的结果不同。IE 直接将arg1改成0, Chrome 下标读取方式由原来的从左往右读改成从右往左读

substring和slice

(1)arg2 > arg1,即参数2大于参数1时

substring:自动颠倒位置,数值大的在arg2位置上,数值小的在arg1位置上
slice:返回空字符串

(2)对负数的处理

substring:将数值为负数的参数转换为0
slice:将数值为负数的参数转换为(字符串长度-参数数值)

Javascript 相关文章推荐
JavaScript 指导方针
Apr 05 Javascript
IE6/7/8中Option元素未设value时Select将获取空字符串
Apr 07 Javascript
浅谈javascript中的作用域
Apr 07 Javascript
一个可拖拽列宽表格实例演示
Nov 26 Javascript
Google 地图类型详解及示例代码
Aug 06 Javascript
原生JS取代一些JQuery方法的简单实现
Sep 20 Javascript
修改npm全局安装模式的路径方法
May 15 Javascript
小程序数据通信方法大全(推荐)
Apr 15 Javascript
vue组件间的参数传递实例详解
Apr 26 Javascript
浅谈ECMAScript 中的Array类型
Jun 10 Javascript
vue+elementUI实现图片上传功能
Aug 20 Javascript
vue.js自定义组件实现v-model双向数据绑定的示例代码
Jan 08 Javascript
javascript 闭包
Sep 15 #Javascript
用JQuery模仿淘宝的图片放大镜显示效果
Sep 15 #Javascript
document.getElementById介绍
Sep 13 #Javascript
动态创建样式表在各浏览器中的差异测试代码
Sep 13 #Javascript
contains和compareDocumentPosition 方法来确定是否HTML节点间的关系
Sep 13 #Javascript
jQuery中使用了document和window哪些属性和方法小结
Sep 13 #Javascript
从jQuery.camelCase()学习string.replace() 函数学习
Sep 13 #Javascript
You might like
分割GBK中文遭遇乱码的解决方法
2013/08/09 PHP
PHP实现根据设备类型自动跳转相应页面的方法
2014/07/24 PHP
PHP往XML中添加节点的方法
2015/03/12 PHP
PHP下载文件的函数实例代码
2016/05/18 PHP
IE8 下的Js错误HTML Parsing Error...
2009/08/14 Javascript
关于html+ashx开发中几个问题的解决方法
2011/07/18 Javascript
javascrpt绑定事件之匿名函数无法解除绑定问题
2012/12/06 Javascript
chrome浏览器不支持onmouseleave事件的解决技巧
2013/05/31 Javascript
非常棒的jQuery图片轮播效果
2016/04/17 Javascript
用React-Native+Mobx做一个迷你水果商城APP(附源码)
2017/12/25 Javascript
在Vue中使用Compass的方法
2018/03/02 Javascript
Js中将Long转换成日期格式的实现方法
2018/06/05 Javascript
vue自定义指令的创建和使用方法实例分析
2018/12/04 Javascript
JavaScript页面倒计时功能完整示例
2019/05/15 Javascript
微信小程序实现底部弹出框
2020/11/18 Javascript
动感网页相册 python编写简单文件夹内图片浏览工具
2016/08/17 Python
python3中str(字符串)的使用教程
2017/03/23 Python
用Eclipse写python程序
2018/02/10 Python
遗传算法python版
2018/03/19 Python
Python实现的本地文件搜索功能示例【测试可用】
2018/05/30 Python
Django model反向关联名称的方法
2018/12/15 Python
python替换字符串中的子串图文步骤
2019/06/19 Python
Python嵌套函数,作用域与偏函数用法实例分析
2019/12/26 Python
Python实现代码块儿折叠
2020/04/15 Python
pandas to_excel 添加颜色操作
2020/07/14 Python
运行Python编写的程序方法实例
2020/10/21 Python
详解Python中的GIL(全局解释器锁)详解及解决GIL的几种方案
2021/01/29 Python
css3实现顶部社会化分享按钮示例
2014/05/06 HTML / CSS
资产评估专业大学生求职信
2013/09/29 职场文书
给护士表扬信
2014/01/19 职场文书
大学生素质拓展活动方案
2014/02/11 职场文书
优秀团员事迹材料1000字
2014/08/20 职场文书
2014年学习全国道德模范事迹思想汇报
2014/09/15 职场文书
Python入门之基础语法详解
2021/05/11 Python
Vue实现tab导航栏并支持左右滑动功能
2021/06/28 Vue.js
Python学习之os包使用教程详解
2022/03/21 Python