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 09 Javascript
jQuery EasyUI基础教程之EasyUI常用组件(推荐)
Jul 15 Javascript
使用jquery如何获取时间
Oct 13 Javascript
原生JS实现垂直手风琴效果
Feb 19 Javascript
完美实现js选项卡切换效果(一)
Mar 08 Javascript
微信小程序教程系列之设置标题栏和导航栏(7)
Jun 29 Javascript
vue使用element-ui的el-input监听不了回车事件的解决方法
Jan 12 Javascript
详解Vue SSR( Vue2 + Koa2 + Webpack4)配置指南
Nov 13 Javascript
微信小程序如何修改本地缓存key中单个数据的详解
Apr 26 Javascript
JavaScript获取当前url路径过程解析
Dec 27 Javascript
webpack的 rquire.context用法实现工程自动化的方法
Feb 07 Javascript
详解Vue.js 可拖放文本框组件的使用
Mar 03 Vue.js
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快速排序quicksort实例详解
2016/09/28 PHP
PHP实现分布式memcache设置web集群session同步的方法
2018/04/10 PHP
基于jquery的多功能软键盘插件
2012/07/25 Javascript
使用node+vue.js实现SPA应用
2016/01/28 Javascript
jQuery实现的模拟弹出窗口功能示例
2016/11/24 Javascript
JavaScript计时器用法分析【setTimeout和clearTimeout】
2017/01/18 Javascript
jQuery插件FusionWidgets实现的AngularGauge图效果示例【附demo源码】
2017/03/23 jQuery
使用mpvue搭建一个初始小程序及项目配置方法
2018/12/03 Javascript
Vue+Node实现的商城用户管理功能示例
2019/12/23 Javascript
[49:21]完美世界DOTA2联赛循环赛 Ink Ice vs LBZS BO2第二场 11.05
2020/11/06 DOTA
零基础写python爬虫之神器正则表达式
2014/11/06 Python
python中global与nonlocal比较
2014/11/21 Python
python登陆asp网站页面的实现代码
2015/01/14 Python
Python运算符重载详解及实例代码
2017/03/07 Python
python 垃圾收集机制的实例详解
2017/08/20 Python
django之session与分页(实例讲解)
2017/11/13 Python
Python迭代器和生成器定义与用法示例
2018/02/10 Python
Python简单爬虫导出CSV文件的实例讲解
2018/07/06 Python
Python字符串通过'+'和join函数拼接新字符串的性能测试比较
2019/03/05 Python
Python流行ORM框架sqlalchemy安装与使用教程
2019/06/04 Python
Django 大文件下载实现过程解析
2019/08/01 Python
python 并发编程 阻塞IO模型原理解析
2019/08/20 Python
python实现引用其他路径包里面的模块
2020/03/09 Python
如何在sublime编辑器中安装python
2020/05/20 Python
Python实现定时监测网站运行状态的示例代码
2020/09/30 Python
Pandas的数据过滤实现
2021/01/15 Python
移动web模拟客户端实现多方框输入密码效果【附代码】
2016/03/25 HTML / CSS
canvas三角函数模拟水波效果的示例代码
2018/07/03 HTML / CSS
中国综合网上购物商城:苏宁易购
2016/08/09 全球购物
自我推荐书
2013/12/04 职场文书
写求职信要注意什么问题
2014/04/12 职场文书
2014年教师政治学习材料
2014/06/02 职场文书
中共广东省委常委会党的群众路线教育实践活动整改方案
2014/09/23 职场文书
2015年医院创卫工作总结
2015/04/22 职场文书
驾驶员安全责任协议书
2016/03/22 职场文书
Linux在两个服务器直接传文件的操作方法
2022/08/05 Servers