JS截取字符串的方法详解

 更新时间:2022年02月16日 10:00:36   作者:秦笑  
本文详细讲解了JS截取字符串的方法,文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

substr() 方法

substr() 方法可在字符串中抽取从 start 下标开始的指定数目的字符。

stringObject.substr(start,length)

start:必需。要抽取的子串的起始下标。必须是数值。如果是负数,那么该参数声明从字符串的尾部开始算起的位置。

也就是说,-1 指字符串中最后一个字符,-2 指倒数第二个字符,以此类推。

length:可选。子串中的字符数。必须是数值。如果省略了该参数,那么返回从 stringObject 的开始位置到结尾的字串。

 记住: substr() 的第二个参数是长度

var str="abcdefg";
str.substr(3)  //  defg
str.substr(3,2)  // de (2表示长度,是下标为3开开始,包括3之后的两个字符)
str.substr(-2)  // fg  2 倒数第二个字符到结尾的字符串
str.substr(-3,2) // ef  倒数第三个字符开始

substring() 方法

substring() 方法用于提取字符串中介于两个指定下标之间的字符。

stringObject.substring(start,stop)

start:  必需。一个非负的整数,规定要提取的子串的第一个字符在 stringObject 中的位置。

stop: 可选。一个非负的整数,比要提取的子串的最后一个字符在 stringObject 中的位置多 1。

如果省略该参数,那么返回的子串会一直到字符串的结尾。

返回值: 一个新的字符串,该字符串值包含 stringObject 的一个子字符串,其内容是从 start 处到 stop-1 处的所有字符,其长度为 stop 减 start。

说明:  substring() 方法返回的子串包括 start 处的字符,但不包括 stop 处的字符。

如果参数 start 与 stop 相等,那么该方法返回的就是一个空串(即长度为 0 的字符串)。如果 start 比 stop 大,那么该方法在提取子串之前会先交换这两个参数。

var str="abcdefg"

str.substring(3) //  defg
str.substring(3,3) //  空的字符串
str.substring(3,5)  //  de 下标为3开始(包括3),到下表为5(不包括5)的字符串
str.substring(5,3)  //  de 当第一个参数 > 第二个参数 时 该方法执行时会先交换两个参数,变成:str.substring(3,5)
str.substring(-3) //  abcdefg substring()不接受负数的参数,参数为负数是,返回原字符串

slice() 方法

slice() 方法可从已有的数组中返回选定的元素。

arrayObject.slice(start,end)

start:必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。

end:可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。

var str="abcdefg"
str.slice(3)  // defg 
str.slice(3,5)  // de
str.slice(-2)   //fg
str.slice(3,-2) //  de
str.slice(-4,-2) // de 负值参数从后面数起, -1表示最后一个元素
str.slice(3,-6) //空数组,当第二个参数指定的元素索引 < 第一个餐宿指定的元素索引,返回空数组

// 如果是数组,则返回一个新数组
var arr = ['a','b','c','d','e','f','g']
str.slice(3)  // ['d','e','f','g']

总结

substr():第一个参数表示元素索引可以为负数, 第二个参数表示截取的字符串长度。

substring():两个参数都不接受负数,都表示元素索引,如果 第一个参数 比 第二个参数大,那么该方法在提取子串之前会先交换这两个参数。

slice(): 两个参数都接受负数,都表示元素索引, 如果 第一个参数 比 第二个参数大,返回空字符串。

到此这篇关于JS截取字符串的方法详解的文章就介绍到这了。希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • javascript 文档的编码问题解决

    javascript 文档的编码问题解决

    在引用与本页面编码格式不一样的js文档时,如果被引用的js代码有ASCII字符之外的字符,那么就会出现代码错误。
    2009-03-03
  • echarts数据可视化实现多个柱状堆叠图顶部显示总数示例

    echarts数据可视化实现多个柱状堆叠图顶部显示总数示例

    这篇文章主要为大家介绍了echarts实现多个柱状堆叠图顶部显示总数示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-07-07
  • 详解js跨域请求的两种方式,支持post请求

    详解js跨域请求的两种方式,支持post请求

    原先一直以为要实现跨域请求只能用jsonp,只能支持GET请求,后来了解到使用POST请求也可以实现跨域,但是需要在服务器增加Access-Control-Allow-Origin和Access-Control-Allow-Headers头,下面说明下两个不同的方法实现的方式和原理。
    2018-05-05
  • Layui表格行工具事件与数据回填方法

    Layui表格行工具事件与数据回填方法

    今天小编就为大家分享一篇Layui表格行工具事件与数据回填方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • 今天,小程序正式支持 SVG

    今天,小程序正式支持 SVG

    这篇文章主要介绍了小程序支持SVG,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • 小程序使用分包的示例代码

    小程序使用分包的示例代码

    这篇文章主要介绍了小程序使用分包的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-03-03
  • 小程序实现搜索框功能

    小程序实现搜索框功能

    这篇文章主要为大家详细介绍了小程序实现搜索框功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-07-07
  • Bootstrap笔记—折叠实例代码

    Bootstrap笔记—折叠实例代码

    本篇文章主要介绍了Bootstrap笔记—折叠实例代码,详细的介绍了折叠效果实例,包括一组多组等,非常具有实用价值,需要的朋友可以参考下。
    2017-03-03
  • js style动态设置table高度

    js style动态设置table高度

    设置table高度想必大家都会,直接在table标签中设置下不就行了吗?这是静态的,如果要动态设置你会吗?下面的实例将教会大家
    2014-10-10
  • JS用最简单的方法实现四舍五入

    JS用最简单的方法实现四舍五入

    在本篇文章里小编给大家整理的是关于JS用最简单的方法实现四舍五入的实例内容,需要的朋友们学习下。
    2019-08-08

最新评论