香港主机空间推荐 快速稳定免备案 虚拟主机空间哪个好
返回列表 发新帖

JS字符串截取函数slice()、substring()、substr()的区别

[复制链接]
回帖奖励 1 金钱 回复本帖可获得 1 金钱奖励! 每人限 1 次

1207

主题

1211

帖子

4106

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
4106
QQ
发表于 2019-1-27 00:34:41  | 显示全部楼层 | 阅读模式
在JS中,slice()、substring()、substr()都有截取字符串的作用,那他们有哪些用法上的区别呢?


一、substring()

substring()方法返回一个索引和另一个索引之间的字符串,语法如下:

str.substring(indexStart, [indexEnd])

下面有六点需要注意:

substring()从提取的字符indexStart可达但不包括 indexEnd
如果indexStart 等于indexEnd,substring()返回一个空字符串。
如果indexEnd省略,则将substring()字符提取到字符串的末尾。
如果任一参数小于0或是NaN,它被视为为0。
如果任何一个参数都大于stringName.length,则被视为是stringName.length。
如果indexStart大于indexEnd,那么效果substring()就好像这两个论点被交换了一样; 例如,str.substring(1, 0) == str.substring(0, 1)

以下是一些示例代码:

  1. var str = 'abcdefghij';

  2. console.log('(1, 2): '   + str.substring(1, 2));   // '(1, 2): b'

  3. console.log('(1, 1): '   + str.substring(1, 1));   // '(1, 1): '

  4. console.log('(-3, 2): '  + str.substring(-3, 2));  // '(-3, 2): ab'

  5. console.log('(-3): '     + str.substring(-3));     // '(-3): abcdefghij'

  6. console.log('(1): '      + str.substring(1));      // '(1): bcdefghij'

  7. console.log('(-20, 2): ' + str.substring(-20, 2)); // '(-20, 2): ab'

  8. console.log('(2, 20): '  + str.substring(2, 20));  // '(2, 20): cdefghij'

  9. console.log('(20, 2): '  + str.substring(20, 2));  // '(20, 2): cdefghij'
复制代码



二、substr()

substr()方法返回从指定位置开始的字符串中指定字符数的字符,语法如下:

str.substr(start, [length])

下面有四点需要注意:

substr()会从start获取长度为length字符(如果截取到字符串的末尾,则会停止截取)。
如果start是正的并且大于或等于字符串的长度,则substr()返回一个空字符串。
若start为负数,则将该值加上字符串长度后再进行计算(如果加上字符串的长度后还是负数,则从0开始截取)。
如果length为0或为负数,substr()返回一个空字符串。如果length省略,则将substr()字符提取到字符串的末尾。

以下是一些示例代码:

  1. var str = 'abcdefghij';

  2. console.log('(1, 2): '   + str.substr(1, 2));   // '(1, 2): bc'

  3. console.log('(-3, 2): '  + str.substr(-3, 2));  // '(-3, 2): hi'

  4. console.log('(-3): '     + str.substr(-3));     // '(-3): hij'

  5. console.log('(1): '      + str.substr(1));      // '(1): bcdefghij'

  6. console.log('(-20, 2): ' + str.substr(-20, 2)); // '(-20, 2): ab'

  7. console.log('(20, 2): '  + str.substr(20, 2));  // '(20, 2): '
复制代码


需要注意的是,Microsoft的JScript不支持起始索引的负值。如果要使用此功能,可以使用以下兼容性代码来解决此错误:

  1. // only run when the substr() function is broken

  2. if ('ab'.substr(-1) != 'b') {

  3.   /**

  4.    *  Get the substring of a string

  5.    *  @param  {integer}  start   where to start the substring

  6.    *  @param  {integer}  length  how many characters to return

  7.    *  @return {string}

  8.    */

  9.   String.prototype.substr = function(substr) {

  10.     return function(start, length) {

  11.       // call the original method

  12.       return substr.call(this,

  13.               // did we get a negative start, calculate how much it is from the beginning of the string

  14.         // adjust the start parameter for negative value

  15.         start < 0 ? this.length + start : start,

  16.         length)

  17.     }

  18.   }(String.prototype.substr);

  19. }

  20. 三、substring()与substr()的主要区别

  21. substring()方法的参数表示起始和结束索引,substr()方法的参数表示起始索引和要包含在生成的字符串中的字符的长度,示例如下:



  22. var text = 'Mozilla';

  23. console.log(text.substring(2,5)); // => "zil"

  24. console.log(text.substr(2,3)); // => "zil"
复制代码



四、slice()

slice()方法返回一个索引和另一个索引之间的字符串,语法如下:

str.slice(beginIndex[, endIndex])

下面有三点需要注意:

若beginIndex为负数,则将该值加上字符串长度后再进行计算(如果加上字符串的长度后还是负数,则从0开始截取)。
如果beginIndex大于或等于字符串的长度,则slice()返回一个空字符串。
如果endIndex省略,则将slice()字符提取到字符串的末尾。如果为负,它被视为strLength + endIndex其中strLength是字符串的长度。

以下是一些示例代码:

  1. var str = 'abcdefghij';

  2. console.log('(1, 2): '   + str.slice(1, 2));   // '(1, 2): b'

  3. console.log('(-3, 2): '  + str.slice(-3, 2));  // '(-3, 2): '

  4. console.log('(-3, 9): '  + str.slice(-3, 9));  // '(-3, 9): hi'

  5. console.log('(-3): '     + str.slice(-3));     // '(-3): hij'

  6. console.log('(-3,-1): ' + str.slice(-3,-1));     // '(-3,-1): hi'

  7. console.log('(0,-1): '  + str.slice(0,-1));     // '(0,-1): abcdefghi'

  8. console.log('(1): '      + str.slice(1));      // '(1): bcdefghij'

  9. console.log('(-20, 2): ' + str.slice(-20, 2)); // '(-20, 2): ab'

  10. console.log('(20): '     + str.slice(20));  // '(20): '

  11. console.log('(20, 2): '  + str.slice(20, 2));  // '(20, 2): '
复制代码


参考文档MDN web docs,原文地址王玉路的个人网站。


回复

使用道具 举报

发表回复

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关于我们
关于我们
友情链接
联系我们
帮助中心
网友中心
购买须知
支付方式
服务支持
资源下载
售后服务
定制流程
关注我们
官方微博
官方空间
官方微信
快速回复 返回顶部 返回列表