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 相关文章推荐
location对象的属性和方法应用(解析URL)
Apr 12 Javascript
js 验证身份证信息有效性
Mar 28 Javascript
Javascript动态创建div的方法
Feb 09 Javascript
jquery合并表格中相同文本的相邻单元格
Jul 17 Javascript
非常实用的12个jquery代码片段
Nov 02 Javascript
js实现动态加载脚本的方法实例汇总
Nov 02 Javascript
jquery实现瀑布流效果 jquery下拉加载新数据
Dec 12 Javascript
jQuery的extend方法【三种】
Dec 14 Javascript
JavaScript设计模式之享元模式实例详解
Jan 17 Javascript
Vue框架下引入ActiveX控件的问题解决
Mar 25 Javascript
20个必会的JavaScript面试题(小结)
Jul 02 Javascript
javascript设计模式 ? 装饰模式原理与应用实例分析
Apr 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
php下过滤HTML代码的函数
2007/12/10 PHP
让Json更懂中文(JSON_UNESCAPED_UNICODE)
2011/10/27 PHP
php去除换行符的方法小结(PHP_EOL变量的使用)
2013/02/16 PHP
解析htaccess伪静态的规则
2013/06/18 PHP
php处理单文件、多文件上传代码分享
2016/08/24 PHP
编写针对IE的JS代码两种编写方法
2013/01/30 Javascript
jQuery插件实现控制网页元素动态居中显示
2015/03/24 Javascript
使用jQuery实现更改默认alert框体
2015/04/13 Javascript
Highcharts学习之坐标轴
2016/08/02 Javascript
浅谈jQuery中的checkbox问题
2016/08/10 Javascript
ES6学习教程之对象的扩展详解
2017/05/02 Javascript
基于axios封装fetch方法及调用实例
2018/02/05 Javascript
详解vue 数据传递的方法
2018/04/19 Javascript
使用javascript做在线算法编程
2018/05/25 Javascript
在React项目中使用Eslint代码检查工具及常见问题
2018/10/10 Javascript
js实现导航跟随效果
2018/11/17 Javascript
JavaScript console的使用方法实例分析
2020/04/28 Javascript
Python Web框架Flask中使用百度云存储BCS实例
2015/02/08 Python
python 实现对文件夹中的图像连续重命名方法
2018/10/25 Python
Python计算时间间隔(精确到微妙)的代码实例
2019/02/26 Python
python提取log文件内容并画出图表
2019/07/08 Python
python脚本后台执行方式
2019/12/21 Python
Pytorch转tflite方式
2020/05/25 Python
Lombok插件安装(IDEA)及配置jar包使用详解
2020/11/04 Python
Python的轻量级ORM框架peewee使用教程
2021/02/05 Python
html5 css3网站菜单实现代码
2013/12/23 HTML / CSS
美国花布包包品牌:Vera Bradley
2017/08/11 全球购物
Stefania Mode英国:奢华设计师和时尚服装
2017/10/23 全球购物
马德里运动鞋商店:Nigra Mercato
2020/02/16 全球购物
XML文档定义有几种形式?它们之间有何本质区别?解析XML文档有哪几种方式?
2016/01/12 面试题
大学生四个方面的自我评价
2013/09/19 职场文书
写给爸爸的道歉信
2014/01/15 职场文书
地震捐款倡议书
2014/08/29 职场文书
体育活动总结
2015/02/04 职场文书
小学数学继续教育研修日志
2015/11/13 职场文书
防止web项目中的SQL注入
2021/12/06 MySQL