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 GUID生成器实现代码
Oct 31 Javascript
JavaScript通过Date-Mask将日期转换成字符串的方法
Jun 04 Javascript
JS中的forEach、$.each、map方法推荐
Apr 05 Javascript
BootStrap智能表单实战系列(四)表单布局介绍
Jun 13 Javascript
用JS写的一个Ajax库(实例代码)
Aug 06 Javascript
详解JavaScript中数组的reduce方法
Dec 02 Javascript
使用JS在浏览器中判断当前网络连接状态的几种方法
May 05 Javascript
Vue2 Vue-cli中使用Typescript的配置详解
Jul 24 Javascript
vue watch监听对象及对应值的变化详解
Feb 24 Javascript
不使用JavaScript实现菜单的打开和关闭效果demo
May 01 Javascript
微信小程序云开发实现数据添加、查询和分页
May 17 Javascript
使用原生javascript开发计算器实例代码
Feb 21 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
一个odbc连mssql分页的类
2006/10/09 PHP
使用cookie实现统计访问者登陆次数
2013/06/08 PHP
解析php多线程下载远程多个文件
2013/06/25 PHP
大家须知简单的php性能优化注意点
2016/01/04 PHP
[对联广告] JS脚本类
2006/08/27 Javascript
escape、encodeURI、encodeURIComponent等方法的区别比较
2006/12/27 Javascript
Jquery拖拽并简单保存的实现代码
2010/11/28 Javascript
jquery内置验证(validate)使用方法示例(表单验证)
2013/12/04 Javascript
jquery实现input输入框实时输入触发事件代码
2014/01/28 Javascript
javascript修改IMG标签的src问题
2014/03/28 Javascript
jquery.ajax之beforeSend方法使用介绍
2014/12/08 Javascript
javascript实现百度地图鼠标滑动事件显示、隐藏
2015/04/02 Javascript
JavaScript获取表格(table)当前行的值、删除行、增加行
2015/07/03 Javascript
javascript insertAfter()定义与用法示例
2016/07/25 Javascript
JS给Array添加是否包含字符串的简单方法
2016/10/29 Javascript
js实现图片懒加载效果
2017/07/17 Javascript
JavaScript函数绑定用法实例分析
2017/11/14 Javascript
详解IWinter 一个路由转控制器的 Nodejs 库
2017/11/15 NodeJs
JS简单获得节点元素的方法示例
2018/02/10 Javascript
axios携带cookie配置详解(axios+koa)
2018/12/28 Javascript
Angular封装搜索框组件操作示例
2019/04/25 Javascript
解决layui的input独占一行的问题
2019/09/10 Javascript
vue脚手架项目创建步骤详解
2021/03/02 Vue.js
python读取注册表中值的方法
2013/04/08 Python
Python 遍历列表里面序号和值的方法(三种)
2017/02/17 Python
Python企业编码生成系统之主程序模块设计详解
2019/07/26 Python
Python爬虫之App爬虫视频下载的实现
2020/12/08 Python
如何让Java程序执行效率更高
2014/06/25 面试题
C语言编程题
2015/03/09 面试题
在校大学生的职业生涯规划书
2014/03/14 职场文书
幼儿教师师德承诺书
2014/05/23 职场文书
科技工作者先进事迹
2014/08/16 职场文书
四风问题班子对照检查材料
2014/09/27 职场文书
皇城相府导游词
2015/02/06 职场文书
导游词书写之黄山
2019/08/06 职场文书
改造DE1103三步曲
2022/04/07 无线电