slice()，substring()和substr()的异同

lyning 发布于2019-08-26 12:23 / 3141人阅读

同

三个方法都是对字符串的截取操作，返回被操作的字符串，不会修改字符串本身；

都接受一或两个参数，第一个参数都为开始的位置；

只有一个参数且为正数的情况下返回的结果相同；

var str = "12345678";
console.log(str.slice(3)); // "45678"
console.log(str.substring(3)); // "45678"
console.log(str.substr(3)); // "45678"

异 1. 第二个参数含义不同

slice()和substring()第二个参数含义都为指定字符串最后一个字符后面的位置，
而substr()第二个参数含义为返回的字符数量

var str = "12345678";
console.log(str.slice(3,4)); // "4"
console.log(str.substring(3,4)); // "4"
console.log(str.substr(3,4)); // "4567"

2. 参数为负数

slice()会把负数与字符串长度相加

var str = "12345678";
console.log(str.slice(-3)); // 相当于 scice(5)  =>  "678"
console.log(str.slice(-3,7)); // 相当于 scice(5,7)  =>  "67"
console.log(str.slice(3,-3)); // 相当于 scice(3,5)  =>  "45"
console.log(str.slice(-5,-3)); // 相当于 scice(3,5)  =>  "45"

substring()会把负数转换为0

var str = "12345678";
console.log(str.substring(-3)); // 相当于 substring(0)  =>  "12345678"
console.log(str.substring(-3,7)); // 相当于 substring(0,7)  =>  "1234567"
console.log(str.substring(-5,-3)); // 相当于 substring(0,0)  =>  ""

substr()第一个参数为负数会把负数与字符串长度相加和slice()相同，第二个参数为负数返回空字符串

var str = "12345678";
console.log(str.substr(-3)); // 相当于 substr(5)  =>  678
console.log(str.substr(5,-3)); // 相当于 substr(5,0)  =>  ""

3. 两个参数位置颠倒

意思为将较大的数作为开始位置，而将较小的数作为结束位置，
这个不同点只在slice()和substring()才存在，
substr()只有一个参数表示位置，还有一个表示长度，所以不存在这个问题

slice()会返回空字符串

var str = "12345678";
console.log(str.slice(5,3)); // ""
console.log(str.slice(-3,3)); // 相当于 scice(5,3)  =>  ""
console.log(str.slice(7,-3)); // 相当于 scice(7,5)  =>  ""

substring()会调换两个参数的位置

var str = "12345678";
console.log(str.substring(5,3)); // 相当于 substring(3,5)  =>  "45"
console.log(str.substring(-3,3)); // 相当于 substring(0,3)  =>  "123"
console.log(str.substring(7,-3)); // 相当于 substring(7,0)  => substring(0,7)  => "1234567"

总结

来张表吧

本篇如能对您有所帮助，实在是感到荣幸。如有不合理之处也请大家多多指点。

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/108601.html

吐槽Javascript系列一：slice()、substr()和 substring()

摘要：点评我们来看这样一个例子给定一个字符串，要求去掉最后一个逗号。大胆假想一下，如果把踢出去，就保留和，你还会懵吗或者更大胆一点，把和都踢出去，就只保留，我反正感觉整个世界都清静了系列链接吐槽系列一和吐槽系列二数组中的和方法吐槽系列三数组的陷阱实不相瞒，对于字符串中的slice()、substr()和 substring()这三个方法，我自己很长一段时间都是理不清的，每次用都得查一下文档...

waltr 2019-08-23 15:10 评论0 收藏0
js substr,slice,substring 的用法与区别

摘要：交换参数位置，小的在前。的如果为负数，同样从尾部算起，如果其绝对值超过原字符串长度或者为，返回空字符串。会取和中较小的值为二者相等返回空字符串，任何一个参数为负数被替换为即该值会成为参数。第二个为负值是始终返回控制符串。 slice，substring,substr三个函数都是截取字符串。先看方法的签名 slice(start, end); // 参数可为负数。第二个参数是指定结束位...

Lin_YT 2019-08-23 10:27 评论0 收藏0
js中截取字符串的三个方法 substring()、substr()、slice()

摘要：方法用于提取字符串中介于两个指定下标之间的字符。一个非负的整数，规定要提取的子串的第一个字符在中的位置。子串中的字符数。控制台方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。查看原文可以有更好的排版效果哦 js中有三个截取字符的方法，分别是substring()、substr()、slice()，平时我们可能都用到过，但总是会对这些方法有点混淆，特别是substring(...

elva 2019-08-23 11:57 评论0 收藏0
浅谈JS字符串的三个方法

摘要：该方法会改变调用该方法的对象有返回值如的方法，会改变一个数组本身的顺序，并且返回一个按要求排列的数组像的方法是不会改变原对象的方法是否是静态的例如的方法都是静态方法最后一点纯属个人恶趣味，我会把一些明显不符合要求的值传入，看看是否出现异常。正文每次遇到某个类型陌生的方法的时候，我通常会思考这样几个问题：该方法需要的传入参数: 不需要传参数的：诸如Array的pop方法；有...

smartlion 2019-08-21 14:04 评论0 收藏0
【JavaScript】String 对象的方法 slice()、substring() 和 sub

摘要：返回值当和运算符一起作为构造函数使用时，它返回一个新创建的对象，存放的是字符串或的字符串表示。返回值一个新的字符串，包含从的包括所指的字符处开始的个字符。 String 对象的方法 slice()、substring() 和 substr() String 对象的方法 slice()、substring() 和 substr() （不建议使用）都可返回字符串的指定部分。slice(st...

ztyzz 2019-08-23 11:36 评论0 收藏0