JS截取字符串 slice、substr、substring三者之间区别

最新推荐文章于 2025-11-27 11:48:46 发布

原创最新推荐文章于 2025-11-27 11:48:46 发布 · 246 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

本文详细比较了JavaScript中slice、substr与substring三种字符串截取方法的使用方式及区别，通过具体实例展示了不同参数设置下这三种方法的行为差异。

首先，我们知道slice、substr、substring这三个方法都是用来截取字符串的，但是在使用上三个各有略同。

下面我们将声明一个字符串，各看看三种方法的打印结果。

let str = "SuperJoker";

当这三个方法的参数均为正数且参数只有一个的时候，三者所打印的结果均相同。

 console.log(str.slice(0)); //SuperJoker
 console.log(str.substr(0)); //SuperJoker
 console.log(str.substring(0)); //SuperJoker

 console.log(str.substring(1)); //uperJoker
 console.log(str.slice(1)); //uperJoker
 console.log(str.substr(1)); //uperJoker

当传入两个参数且都为正数的时候，三者的第一个参数都表示为起始位置，slice、substring的第二个参数表示截取至索引号为3的前面，而substr则表示从第一个字符串开始起截取三个字符串。

console.log(str.slice(1,3)); //up
console.log(str.substring(1,3)); //up
console.log(str.substr(1,3)) //upe

当传入的参数均为负数且参数只有一个的时候，slice与substr返回的结果是一样的，而substring这个方法如果传入负数的话，则会默认把负数当做0计算，因此截取的是完整的字符串。

console.log(str.slice(-3)); //ker
console.log(str.substring(-3)); //SuperJoker
console.log(str.substr(-3)) //ker

当传入两个参数均为负数的情况,slice的第二个参数表示从-3开始截取到后面的第几个，substr的第二个参数是指数量，意思是从-3开始截取两位。如果向substring中传入两位负数，则默认会把两个负数都转化成0，因此substring（0,0）相当于什么也没截取。

console.log(str.slice(-3,-1)); //ke
console.log(str.substring(-3,-1)); //无法截取 相当于str.substring(0,0)
console.log(str.substr(-3,2)); //ke

以上均为个人总结的三种字符串的区别。

标签

#js