最近整前台总多多少少遇到一些字符串截取的小问题,忍不住仔细看了下。接下来总结一下javascript中字符串截取方法的一些应用经验和区别。看了其他博主也有写到,各有风格况且只是个人随记,自己体会的才最深刻。 一些看似简单深究又大有文章的东西弄懂了你才知道自己所学甚浅,部分内容是w3cSchool原文,然后增加了自己的总结和见解。看完有兴趣的也可以去官网查看。
以下为总结:
var str = "0123456789"; //此字符串为上下文举例用
一、stringObject.substring(start,stop) : 提取字符串中两个指定的索引号之间的字符。 (w3school定义)
1.截取索引start和stop之间的字符,字符长度为(stop-start)。
2.索引从字符串左侧数0开始,字符串包括[start,stop)即包括start不包括stop。
例: var ss = str.substring(1,5);
//ss为1234 包括索引为1位置的字符串,不包括索引为5位置的字符窜。字符串长度为5-1=4
3.如果参数 start 与 stop 相等,那么该方法返回的就是一个空串。
4.如果 start 比 stop 大,那么该方法在提取字符串之前会先交换这两个参数。
例: str.substring(5, 2) = str.substring(2, 5)
5.如果start或stop出现负数,则先将负数转为0 再执行第4条,最后执行字符串截取。
例:str.substring(3, -5) → str.substring(3, 0) → str.substring(0, 3) // 结果为 012
6.参数stop可省略,省略的情况下从start开始截取到字符串最后。
例:str.substring(5); //结果为 56789
如果亲自尝试的话会发现substring无非就是截取两个索引之间的字符串,遇到负数直接变为0。看起来顺序都可以直接忽略,即使start > stop 他也会自行排序,至于这么写会不会影响执行效率,我就没有深究啦,无聊的时候有兴趣的可以研究一下。
二、stringObject.slice(start,end) : 方法可提取字符串的某个部分,并以新的字符串返回被提取的部分。(w3school定义)
w3school的定义我只理解了前半部分,slice()方法不止可以操作字符串对象,也可以操作arrayObject也就是数组对象,基于我们再次只说明字符串截取,数组就略过了(下面附了官网链接)。
1.截取索引start和stop之间的字符,字符长度为(stop-start)。 [效果同substring]
2.索引从0开始,字符串包括[start,stop)即包括start不包括stop。 [效果同substring]
3.如果参数 start 与 stop 相等,那么该方法返回的就是一个空字符串。 [效果同substring]
4.参数stop可省略,省略的情况下从start开始截取到字符串最后。 [效果同substring]
5.如果 start 比 stop 大,此处不会进行排序,截取的结果为""空字符串。
例: str.slice(5, 1); //结果为 ""
6.如果start为负数,则该参数规定的是从字符串的尾部开始算起的位置。也就是说,-1 指字符串的最后一个字符,-2 指倒数第二个字符,以此类推。
例: str.substring(-2); //结果为 89 (9索引为-1 8索引为-2, stop省略时截取到最后则为,从8开始到最后为89)
7.如果stop是负数,那么它规定的是从字符串的尾部开始算起的位置,同第6条。
例: str.substring(-5,-4); //结果为 5
8.以下例子:
str.substring(5, 8); //结果为 "567"
str.substring(5, 3); //结果为 ""
str.substring(-5,8); //结果为 "567"
str.substring(-5,3); //结果为 ""
str.substring(-5,-3); //结果为 "56"
因为涉及到负数的时候会从字符串末尾开始找索引的情况,这会使整体看起来有点复杂,所以我更愿意用索引的位置来解释。slice()看起来就像是一个抓住索引位置认死理的方法,我就是只截取start位置和stop位置之间的部分,如果stop的位置在start之前则为空字符串,在start的位置之后才会截取。所以用数数就可以解决slice()方法所有的情况,正数就从前面数,负数就从末尾数,在满足start在前stop在后的情况下,取[start, stop)的部分就可以了。
三、stringObject.substr(start,length) : 在字符串中抽取从 start 下标开始的指定数目的字符。 (w3school定义)
跟前两个不一样的地方在于,他不是获取两字索引之间的字符串,如定义,是从某个索引开始截取length长度的字符串。
1.start参数为截取开始的索引位置,正数从左侧数0开始,负数则从右侧数-1开始。往右侧截取长度为length的字符串。
例: str.substr(2, 5); //结果为 23456 长度为5
2.如果参数length省略,则从索引start开始,截取到字符串结尾。
3.当参数length为负数时,则转化为0,所以当length为负数或0时,截取的结果均为""空字符串。
官网提示:
重要事项:ECMAscript 没有对该方法进行标准化,因此反对使用它。
重要事项:在 IE 4 中,参数 start 的值无效。在这个 BUG 中,start 规定的是第 0 个字符的位置。在之后的版本中,此 BUG 已被修正。
最后还有几点个人的友情提示:
1.substring情况下,如果stop超过字符串长度,运行中stop为字符串长度,则截取到字符串最后。
例: str.substring(-3, 20); //实际上效果等同于str.substring(0, 10)或str.substring(0)
2.slice的索引超出字符串长度时。
例:str.slice(-20, 20); //等于 str.slice(-10,10)或str.slice(0,10)或str.slice(-10)或str.slice(0)
str.slice(-5, 20); //等于 str.slice(-5,10)或str.slice(-5)
3.substr情况下。
例:str.substr(-15, 5); //等于str.substr(0,5);
其他情况都是基于以上的方法转换,小于最小的时候取最小,大于最大的时候取最大。搞清楚基本情况随机应变就可以了。
我在网络上看到substr()方法后面总是写着(不建议使用),具体的原因我不大清楚,但还是因人而已,总之搞清楚了,选择自己喜欢的就好。我只觉得花了时间看以前只是模糊使用的方法,会让自己更清晰,也希望有人有兴趣能解答我上面的疑问。 以上均为个人整理的资料,有想清晰方法的点以下链接进官网。
w3cSchool官网地址: http://www.w3school.com.cn/index.html javaScript操作字符串对象网址: http://www.w3school.com.cn/jsref/jsref_obj_string.asp slice()方法操作数组: http://www.w3school.com.cn/jsref/jsref_slice_array.asp