JavaScript截取字符串的Slice、Substring、Substr函数详解和比较


Posted in Javascript onMarch 20, 2014

在JavaScript中,提取子字符串主要是通过 Slice、Substring、Substr 三个方法之一。

// slice 
// 语法: string.slice(start [, stop])
"Good news, everyone!".slice(5,9); 
// 'news'
// substring 
// 语法: string.substring(indexA [, indexB])
"Good news, everyone!".substring(5,9); 
// 'news'
// substr
// 语法: string.substr(start [, length])
"Good news, everyone!".substr(5,4); 
// 'news'

在三个方法之中输入一个  start 的索引参数,和一个可选的 end 索引( 或 length )参数。

但他们在一些重要的方面有所不同:
1.substr()方法从指定位置,提取指定数量的字符。
param: start 开始提取字符的位置索引,length 提取字符的数量长度。
return: 一个新的字符串。 从 start 处开始的 length 个字符。
在不同浏览器有不一致的表现,现代浏览器允许 start 索引参数为负数,来表示从字符串结尾处开始,提取字符的数量。但是在ie8及以下版本浏览器 start索引参数 最小从0开始计算。【 substr 为Web浏览器附加的ECMAScript特性,不建议使用时 start 索引为负值】

var str = "abcdefghij";
console.log("(1): "      + str.substr(1));     // (1): bcdefghij
console.log("(1,2): "    + str.substr(1,2));   // (1,2): bc
console.log("(-3): "     + str.substr(-3));    // (-3): hij
console.log("(-3,2): "   + str.substr(-3,2));  // (-3,2): hi
console.log("(20, 2): "  + str.substr(20,2));  // (20, 2):
console.log("(-20, 2): " + str.substr(-20,2)); // (-20, 2): ab
 
// ie8及以下
console.log("(-3): " + str.substr(-2)); // (-20, 2): hij
console.log("(-3, 2): " + str.substr(-2)); // (-20, 2): ab

2.substring() 方法用于提取字符串 一个index索引至另一个之间的子集, 或是直到字符串的结束。
param: indexA, indexB 两个参数取值范围为一个0 至 字符串长度之间的整数。
return: 返回一个新的字符串, 从小的索引开始 到 大的索引之间,包括小的索引位置字符,不包括大的索引位置字符。
substring 的参数是可反转的,它总是使用小的的参数值作为开始,大的参数值作为结束。 如果参数是小于0或NaN,它被看作是0,如果参数大于字符串的长度,被视为字符串的长度值.
// assumes a print function is defined
var anyString = "Mozilla";
// Displays "Moz"
console.log(anyString.substring(0,3));
console.log(anyString.substring(3,0));
// Displays "lla"
console.log(anyString.substring(4,7));
console.log(anyString.substring(7,4));
// Displays "Mozill"
console.log(anyString.substring(0,6));
// Displays "Mozilla"
console.log(anyString.substring(0,7));
console.log(anyString.substring(0,10));

3.slice 提取字符串的一部分。
param: beginSlice开始提取字符的位置索引,可以为负,如果为负值被视为(sourceLength-beginSlice),sourceLength是字符串的长度,即:从字符串的尾部开始算起的位置endSlice 结束提取的字符的位置索引。如果省略,提取到结束。如果为负值被视为(sourceLength-endSlice)。
return: 返回一个新的字符串,从 start 开始(包括 start)到 end 结束(不包括 end)为止的所有字符。
参数都可以为负,如果索引是负的,则从字符串的尾部开始算起。

var str1 = "The morning is upon us.";
console.log(str1.slice(4, -2));   //  morning is upon u
var str = "The morning is upon us.";
str.slice(-3);     // "us."
str.slice(-3, -1); // "us"
str.slice(0, -1);  // "The morning is upon us"
Javascript 相关文章推荐
JavaScript 字符串乘法
Aug 20 Javascript
jQuery 绑定事件到动态创建的元素上的方法实例
Aug 18 Javascript
js动态创建标签示例代码
Jun 09 Javascript
如何使用Bootstrap的modal组件自定义alert,confirm和modal对话框
Mar 01 Javascript
JS实现鼠标框选效果完整实例
Jun 20 Javascript
基于JavaScript实现树形下拉框
Aug 10 Javascript
原生js编写基于面向对象的分页组件
Dec 05 Javascript
微信小程序左滑删除效果的实现代码
Feb 20 Javascript
微信小程序仿知乎实现评论留言功能
Nov 28 Javascript
浅谈layui 表单元素的选中问题
Oct 25 Javascript
JS+canvas五子棋人机对战实现步骤详解
Jun 04 Javascript
JavaScript中展开运算符及应用的实例代码
Jan 14 Javascript
js拖拽一些常见的思路方法整理
Mar 19 #Javascript
使用jquery实现以post打开新窗口
Mar 19 #Javascript
jquery判断小数点两位和自动删除小数两位后的数字
Mar 19 #Javascript
改变隐藏的input中value值的方法
Mar 19 #Javascript
js获取url中的参数且参数为中文时通过js解码
Mar 19 #Javascript
JS 打印界面的CSS居中代码适用所有浏览器
Mar 19 #Javascript
兼容所有浏览器的js复制插件Zero使用介绍
Mar 19 #Javascript
You might like
一个显示天气预报的程序
2006/10/09 PHP
改进:论坛UBB代码自动插入方式
2006/12/22 Javascript
Javascript 对象的解释
2008/11/24 Javascript
php gethostbyname获取域名ip地址函数详解
2010/01/24 Javascript
javascript中的变量是传值还是传址的?
2010/04/19 Javascript
JavaScript arguments 多参传值函数
2010/10/24 Javascript
Jquery中Ajax 缓存带来的影响的解决方法
2011/05/19 Javascript
js鼠标及对象坐标控制属性详细解析
2013/12/14 Javascript
node.js中的buffer.toString方法使用说明
2014/12/14 Javascript
jQuery+css实现非常漂亮的水平导航菜单效果
2016/07/27 Javascript
Vue制作Todo List网页
2017/04/26 Javascript
浅谈Vue SSR 的 Cookies 问题
2017/11/20 Javascript
支付宝小程序tabbar底部导航
2018/11/06 Javascript
JS实现的类似微信聊天效果示例
2019/01/29 Javascript
使用Vue.observable()进行状态管理的实例代码详解
2019/05/26 Javascript
layui原生表单验证的实例
2019/09/09 Javascript
vue-cli4项目开启eslint保存时自动格式问题
2020/07/13 Javascript
[00:34]TI7不朽珍藏III——地穴编织者不朽展示
2017/07/15 DOTA
在Python的Django框架中实现Hacker News的一些功能
2015/04/17 Python
python3大文件解压和基本操作
2017/12/15 Python
Python中的默认参数实例分析
2018/01/29 Python
使用pytorch进行图像的顺序读取方法
2018/07/27 Python
解决TensorFlow模型恢复报错的问题
2020/02/06 Python
美国鞋类购物网站:Shiekh Shoes
2016/08/21 全球购物
Tech21美国/加拿大:英国NO.1防摔保护壳品牌
2018/01/20 全球购物
美国最大的购物网站:Amazon.com(亚马逊美国)
2020/05/23 全球购物
几个常见的软件测试问题
2016/09/07 面试题
实习期自我鉴定
2013/10/11 职场文书
求职简历自荐信
2013/10/20 职场文书
文史专业毕业生自荐信
2013/11/17 职场文书
平安工地汇报材料
2014/08/19 职场文书
学生上课说话检讨书
2014/10/25 职场文书
安全责任协议书范本
2016/03/23 职场文书
导游词之杭州岳王庙
2019/11/13 职场文书
使用vue判断当前环境是安卓还是IOS
2022/04/12 Vue.js
详解Spring Bean的配置方式与实例化
2022/06/10 Java/Android