返回

JavaScript 字符串操作方法:slice()、substr()、substring() 三剑客

前端

  1. slice() 方法

slice() 方法用于从字符串中提取子字符串。它的语法格式如下:

string.slice(start, end);

其中,start 表示要提取子字符串的起始位置,end 表示要提取子字符串的结束位置。需要注意的是,end 位置不包含在提取的子字符串中。

例如,以下代码从字符串 "Hello, world!" 中提取子字符串 "Hello":

const str = "Hello, world!";
const result = str.slice(0, 5);
console.log(result); // 输出: "Hello"

2. substr() 方法

substr() 方法用于从字符串中提取子字符串。它的语法格式如下:

string.substr(start, length);

其中,start 表示要提取子字符串的起始位置,length 表示要提取子字符串的长度。

例如,以下代码从字符串 "Hello, world!" 中提取子字符串 "Hello":

const str = "Hello, world!";
const result = str.substr(0, 5);
console.log(result); // 输出: "Hello"

3. substring() 方法

substring() 方法用于从字符串中提取子字符串。它的语法格式如下:

string.substring(start, end);

其中,start 表示要提取子字符串的起始位置,end 表示要提取子字符串的结束位置。与 slice() 方法不同,substring() 方法的 end 位置是包含在提取的子字符串中的。

例如,以下代码从字符串 "Hello, world!" 中提取子字符串 "Hello":

const str = "Hello, world!";
const result = str.substring(0, 5);
console.log(result); // 输出: "Hello,"

4. 三种方法的区别

这三种方法的主要区别在于第二个参数的含义。slice() 和 substring() 的第二个参数表示要提取子字符串的结束位置,而 substr() 的第二个参数表示要提取子字符串的长度。

此外,substring() 方法的两个参数都可以为负数,负数表示从字符串的末尾开始计数。

5. 使用场景

在实际开发中,这三种方法都可以用于从字符串中提取子字符串。但是,在某些情况下,使用不同的方法可以带来更好的性能。

  • slice() 方法在需要提取子字符串的起始位置和结束位置已知的情况下使用,因为它具有更好的性能。
  • substr() 方法在需要提取子字符串的起始位置已知,但不知道要提取子字符串的长度的情况下使用。
  • substring() 方法在需要提取子字符串的起始位置和结束位置都已知的情况下使用,但需要从字符串的末尾开始计数。