JavaScript 字符串截取:Slice、Substring 与 Substr 详解

作者:代码拾荒时间:2026-10-24 22:47:11浏览:385

本文详细介绍JavaScript中三种常用的字符串截取方法:slice、substring和substr。通过对比参数规则、负数处理及返回值差异,帮助开发者准确掌握各方法的适用场景与注意事项,避免常见编码错误。

前言:在开发过程中,我们经常需要对字符串进行部分截取。本文将介绍三种常用的JavaScript字符串截取方法来解决这一问题。

一、Slice方法

1. 双参数模式:

该方法接受两个参数:起始索引(开始位置)和终止索引(结束位置)。其功能是从字符串中提取指定部分,并返回一个新的字符串。

包前不包后

var str="HelloTwd";
// slice方法  
// 两个参数:起始索引(开始位置),终止索引(结束位置)。
// 提取字符串的某个部分并在新字符串中返回被提取的部分。 
// 包前不包后
var res=str.slice(1,5);
console.log(res);

一、Slice方法

2. 负数参数处理:

当参数为负数时,计数方向从字符串末尾开始,包后不包前。

var str="HelloTwd";
// 如果某个参数为负,则从字符串的结尾开始计数。
// 包后不包前
var res1=str.slice(1,-5)
console.log(res1);

一、Slice方法

3. 单参数模式:

若省略第二个参数,该方法将截取从起始索引到字符串末尾的所有内容,包前。若此时参数为负数,则从字符串末尾开始计数,并包含该索引位置的字符。

var str="HelloTwd";
// 如果省略第二个参数,则该方法将裁剪字符串的剩余部分:
// 包前
var res2=str.slice(5)
console.log(res2);
// 从结尾开始计数,包括裁切数值的位置的字符
var res3=str.slice(-5)
console.log(res3);

一、Slice方法

4. 注意事项:

当索引为正数时,从0开始计数;若为负数,则从-1开始(即字符串末尾索引为-1),而非从0开始。

二、Substring方法

1. 双参数模式:

substring() 的行为类似于 slice(),主要区别在于 substring() 不接受负数索引。包前不包后。

var str="HelloTwd"
// substring() 类似于 slice()。
// 不同之处在于 substring() 无法接受负的索引。
// 包前不包后
var res=str.substring(1,5)
console.log(res);

一、Slice方法

2. 单参数模式:

若省略第二个参数,substring() 将截取从起始索引到字符串末尾的剩余部分,包前。

var str="HelloTwd"
// 如果省略第二个参数,则该 substring() 将裁剪字符串的剩余部分。
// 包前
var res1=str.substring(5)
console.log(res1);

一、Slice方法

3. 注意事项:

如果传入负数索引,该方法将返回整个字符串。

var str="HelloTwd"
// 如果为负数,则返回整个字符串
var res3=str.substring(-2)
console.log(res3);

一、Slice方法

三、Substr方法

1. 双参数模式:

substr() 类似于 slice(),不同之处在于第二个参数指定的是被提取部分的长度。不包前

var str="HelloTwd"
// substr() 类似于 slice()。
// 不同之处在于第二个参数规定被提取部分的长度。
// 不包前
var res=str.substr(1,6)
console.log(res);

一、Slice方法

当第一个参数为负数时,包括裁剪数值所在位置的字符。

var str="HelloTwd"
// 为负数
// 包括裁剪的数值处的字符
var res1=str.substr(-2,2)
console.log(res1);

一、Slice方法

2. 单参数模式:

** 如果省略第二个参数,substr() 将截取从起始索引到字符串末尾的剩余部分,包括要分隔数值处的字符。**

var str="HelloTwd"
// 如果省略第二个参数,则该 substr() 将裁剪字符串的剩余部分。
// 包括要分隔的数值出的字符
var res2=str.substr(-5)
console.log(res2);

一、Slice方法

3. 注意事项:

若起始索引超出字符串范围,则不输出任何内容。

到此这篇关于js裁剪(分隔)字符串的三种常用方法的文章就介绍到这了,更多相关js 分隔字符串内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站!

作者最新文章