掌握 JavaScript：面试中的关键考点总结(字符串)

呆同学
242 阅读8分钟

引言

在上一篇文章中我们对 JavaScript 中数组的常见 API 进行了一个总结，那么接下来我们对 JavaScript 的字符串的常见 API 进行一个总结。

通过理解每种方法的参数、返回值及其应用场景，你可以更灵活地处理字符串操作，满足不同的需求。在实际开发中，合理利用这些方法可以提高代码的可读性和开发效率。

JavaScript 字符串常用方法

字符串的增加

1. concat()

  • 参数：一个或多个要连接的字符串。
  • 返回值：连接后的新字符串。
  • 说明：将一个或多个字符串连接在一起，返回一个新字符串，原字符串不变。
let str1 = 'Hello';
let str2 = 'World';
let result = str1.concat(' ', str2); // result = "Hello World"

应用场景：构建动态字符串，例如生成用户欢迎消息时。

字符串的删除

1. slice()

  • 参数：

    ①. start：开始索引（包含）。

    ②. end（可选）：结束索引（不包含）。如果省略，则到字符串末尾。

  • 返回值：从 start 到 end（不包含）之间的子字符串。

  • 说明：提取字符串的一部分，并返回一个新的字符串，原字符串不变。

let str = 'Hello World';
let substr = str.slice(6, 11); // substr = "World"

应用场景：从字符串中提取特定部分，如截取文件名。

2. substring()

  • 参数：

    ①. start：开始索引（包含）。

    ②. end（可选）：结束索引（不包含）。如果省略，则到字符串末尾。

  • 返回值：从 start 到 end（不包含）之间的子字符串。

  • 说明：提取字符串的一部分，并返回一个新的字符串，原字符串不变。substring() 不接受负值参数，如果有负值会将其转换为 0。

let str = 'Hello World';
let substr = str.substring(6, 11); // substr = "World"

应用场景：提取字符串中的某个片段，如用户输入的子串提取。

3. substr()

  • 参数：

    ①. start：开始索引（包含）。

    ②. length（可选）：要提取的字符数。

  • 返回值：从 start 开始的指定长度的子字符串。

  • 说明：提取字符串的一部分，并返回一个新的字符串，原字符串不变。substr() 方法在较新的规范中已经被弃用，建议使用 slice() 或 substring()。

let str = 'Hello World';
let substr = str.substr(6, 5); // substr = "World"

字符串的修改

1. replace()

  • 参数：

    ①. searchValue：要替换的子字符串或正则表达式。

    ②. newValue：替换成的字符串。

  • 返回值：替换后的新字符串。

  • 说明：用 newValue 替换 searchValue，如果 searchValue 是正则表达式且带有全局标志 g，会替换所有匹配项，否则只替换第一个匹配项。

let str = 'Hello World';
let newStr = str.replace('World', 'JavaScript'); // newStr = "Hello JavaScript"

应用场景：更新字符串内容，如在表单提交后替换占位符。

2. trim()

  • 参数：无。
  • 返回值：删除首尾空白字符后的新字符串。
  • 说明：去除字符串两端的空白字符（包括空格、换行符等）。
let str = '   Hello World   ';
let trimmedStr = str.trim(); // trimmedStr = "Hello World"

应用场景：清理用户输入的多余空白，如表单字段校验。

3. trimLeft() / trimStart()

  • 参数：无。
  • 返回值：删除字符串开头的空白字符后的新字符串。
  • 说明：去除字符串开头的空白字符（包括空格、换行符等）。
let str = '   Hello World   ';
let trimmedStr = str.trimStart(); // trimmedStr = "Hello World   "

应用场景：处理需要去除左侧空白的场景，如文本对齐。

4. trimRight() / trimEnd()

  • 参数：无。
  • 返回值：删除字符串末尾的空白字符后的新字符串。
  • 说明：去除字符串末尾的空白字符（包括空格、换行符等）。
let str = '   Hello World   ';
let trimmedStr = str.trimEnd(); // trimmedStr = "   Hello World"

应用场景：处理需要去除右侧空白的场景，如格式化输出结果。

5. toUpperCase()

  • 参数：无。
  • 返回值：将所有字符转换为大写后的新字符串。
  • 说明：将字符串中的所有字符转换为大写，原字符串不变。
let str = 'Hello World';
let upperStr = str.toUpperCase(); // upperStr = "HELLO WORLD"

应用场景：进行不区分大小写的比较或输出。

6. toLowerCase()

  • 参数：无。
  • 返回值：将所有字符转换为小写后的新字符串。
  • 说明：将字符串中的所有字符转换为小写，原字符串不变。
let str = 'Hello World';
let lowerStr = str.toLowerCase(); // lowerStr = "hello world"

应用场景：进行不区分大小写的比较或标准化输入。

7. padStart()

  • 参数：

    ①. targetLength：目标字符串长度。

    ②. padString（可选）：用于填充的字符串，默认是空格。

  • 返回值：填充后的新字符串，原字符串不变。

  • 说明：将原字符串填充到目标长度，填充字符放在字符串开头。

let str = '5';
let paddedStr = str.padStart(3, '0'); // paddedStr = "005"

应用场景：格式化数字，例如在表单中显示编号或货币格式。

8. padEnd()

  • 参数：

    ①. targetLength：目标字符串长度。

    ②. padString（可选）：用于填充的字符串，默认是空格。

  • 返回值：填充后的新字符串，原字符串不变。

  • 说明：将原字符串填充到目标长度，填充字符放在字符串末尾。

let str = '5';
let paddedStr = str.padEnd(3, '0'); // paddedStr = "500"

应用场景：格式化文本输出，例如对齐列宽度。

字符串的查找

1. charAt()

  • 参数：

    index：要获取字符的索引。

  • 返回值：指定索引处的字符。

  • 说明：返回字符串中指定索引的字符，如果索引超出范围，则返回空字符串。

let str = 'Hello';
let char = str.charAt(1); // char = 'e'

应用场景：提取特定位置的字符，如处理密码字符时。

2. startsWith()

  • 参数：

    ①. searchString：要搜索的字符串。

    ②. position（可选）：开始搜索的位置，默认为 0。

  • 返回值：布尔值，表示字符串是否以 searchString 开头。

  • 说明：检查字符串是否以指定的子字符串开始。

let str = 'Hello World';
let starts = str.startsWith('Hello'); // starts = true

应用场景：验证字符串的前缀，例如检查 URL 是否符合特定模式。

3. endsWith()

  • 参数：

    ①. searchString：要搜索的字符串。

    ②. length（可选）：要检查的字符串长度。

  • 返回值：布尔值，表示字符串是否以 searchString 结尾。

  • 说明：检查字符串是否以指定的子字符串结尾。

let str = 'Hello World';
let ends = str.endsWith('World'); // ends = true

应用场景：验证文件扩展名或 URL 后缀。

4. indexOf()

  • 参数：

    ①. searchValue：要查找的子字符串。

    ②. fromIndex（可选）：开始搜索的位置，默认为 0。

  • 返回值：子字符串首次出现的位置索引，如果未找到则返回 -1。

  • 说明：查找子字符串首次出现的位置。

let str = 'Hello World';
let index = str.indexOf('World'); // index = 6

应用场景：查找子字符串位置，例如搜索文本中的关键字。

5. lastIndexOf()

  • 参数：

    ①. searchValue：要查找的子字符串。

    ②. fromIndex（可选）：开始搜索的位置，从右到左搜索，默认为字符串末尾。

  • 返回值：子字符串最后一次出现的位置索引，如果未找到则返回 -1。

  • 说明：查找子字符串最后一次出现的位置。

let str = 'Hello World World';
let index = str.lastIndexOf('World'); // index = 12

应用场景：查找子字符串最后出现的位置，如处理日志文件时。

6. includes()

  • 参数：

    ①. searchString：要查找的子字符串。

    ②. position（可选）：开始搜索的位置，默认为 0。

  • 返回值：布尔值，表示字符串是否包含 searchString。

  • 说明：检查字符串是否包含指定的子字符串。

let str = 'Hello World';
let contains = str.includes('World'); // contains = true

应用场景：检查用户输入是否符合特定条件，如检查邮件地址是否有效。

7. search()

  • 参数：

    regexp：正则表达式对象。

  • 返回值：正则表达式匹配的位置索引，如果未找到则返回 -1。

  • 说明：使用正则表达式搜索字符串，并返回匹配项的起始位置。

let str = 'Hello World';
let index = str.search(/World/); // index = 6

应用场景：在文本中查找正则表达式匹配的内容，如文本分析。

8. match()

  • 参数：

    regexp：正则表达式对象。

  • 返回值：匹配结果数组。如果 regexp 有全局标志 g，返回所有匹配项的数组，否则返回第一个匹配项的数组。如果没有匹配项则返回 null。

  • 说明：根据正则表达式匹配字符串，并返回匹配结果。

let str = 'Hello World World';
let matches = str.match(/World/g); // matches = ["World", "World"]

应用场景：提取字符串中的多个匹配项，如提取所有匹配的电子邮件地址。

字符串的转换

split()

  • 参数：

    ①. separator：分隔符，可以是字符串或正则表达式。

    ②. limit（可选）：返回的数组的最大长度。

  • 返回值：由分隔符分割后的子字符串组成的数组。

  • 说明：将字符串分割成数组，分隔符决定了分割的位置。

let str = 'a,b,c';
let arr = str.split(','); // arr = ["a", "b", "c"]

应用场景：处理由特定分隔符分隔的字符串，如 CSV 文件解析。

总结

理解并灵活运用这些字符串方法，可以大大提升你在处理文本数据时的能力，确保代码更加高效、清晰和易于维护。在实际开发中，掌握这些方法将使你在数据处理、格式化输出和文本分析方面游刃有余。

avatar
文章
阅读
粉丝