JavaScript常用字符串方法介绍

2025/3/8
本文详细介绍了JavaScript中25个常用的字符串方法,包括其功能、使用示例等,这些方法能满足大多数字符串操作需求,助您提高代码效率与可读性。
JavaScript字符串方法示例代码截图,不同字符串方法操作演示的可视化图表

JavaScript 提供了丰富的字符串操作方法,以下是一些常用的字符串方法及其简要说明:

1. length

  • 返回字符串的长度。
const str = "Hello";
console.log(str.length); // 5

2. charAt(index)

  • 返回指定索引位置的字符。
const str = "Hello";
console.log(str.charAt(1)); // "e"

3. charCodeAt(index)

  • 返回指定索引位置字符的 Unicode 值。
const str = "Hello";
console.log(str.charCodeAt(1)); // 101

4. concat(str1, str2, ...)

  • 连接两个或多个字符串,返回新的字符串。
const str1 = "Hello";
const str2 = "World";
console.log(str1.concat(" ", str2)); // "Hello World"

5. includes(searchString, position)

  • 判断字符串是否包含指定的子字符串,返回布尔值。
const str = "Hello World";
console.log(str.includes("World")); // true

6. indexOf(searchValue, fromIndex)

  • 返回指定子字符串首次出现的索引,未找到则返回 -1
const str = "Hello World";
console.log(str.indexOf("World")); // 6

7. lastIndexOf(searchValue, fromIndex)

  • 返回指定子字符串最后一次出现的索引,未找到则返回 -1
const str = "Hello World";
console.log(str.lastIndexOf("o")); // 7

8. match(regexp)

  • 使用正则表达式匹配字符串,返回匹配结果的数组。
const str = "Hello World";
console.log(str.match(/o/g)); // ["o", "o"]

9. replace(searchValue, replaceValue)

  • 替换字符串中的子字符串或正则表达式匹配的内容。
const str = "Hello World";
console.log(str.replace("World", "JavaScript")); // "Hello JavaScript"

10. slice(startIndex, endIndex)

- 提取字符串的一部分,返回新的字符串。
```javascript
const str = "Hello World";
console.log(str.slice(0, 5)); // "Hello"
```

11. split(separator, limit)

- 将字符串分割成数组,根据指定的分隔符。
```javascript
const str = "Hello,World";
console.log(str.split(",")); // ["Hello", "World"]
```

12. substring(startIndex, endIndex)

- 提取字符串的一部分,返回新的字符串。
```javascript
const str = "Hello World";
console.log(str.substring(0, 5)); // "Hello"
```

13. toLowerCase()

- 将字符串转换为小写。
```javascript
const str = "Hello World";
console.log(str.toLowerCase()); // "hello world"
```

14. toUpperCase()

- 将字符串转换为大写。
```javascript
const str = "Hello World";
console.log(str.toUpperCase()); // "HELLO WORLD"
```

15. trim()

- 去除字符串两端的空白字符。
```javascript
const str = "  Hello World  ";
console.log(str.trim()); // "Hello World"
```

16. trimStart() / trimLeft()

- 去除字符串开头的空白字符。
```javascript
const str = "  Hello World  ";
console.log(str.trimStart()); // "Hello World  "
```

17. trimEnd() / trimRight()

- 去除字符串末尾的空白字符。
```javascript
const str = "  Hello World  ";
console.log(str.trimEnd()); // "  Hello World"
```

18. startsWith(searchString, position)

- 判断字符串是否以指定的子字符串开头,返回布尔值。
```javascript
const str = "Hello World";
console.log(str.startsWith("Hello")); // true
```

19. endsWith(searchString, length)

- 判断字符串是否以指定的子字符串结尾,返回布尔值。
```javascript
const str = "Hello World";
console.log(str.endsWith("World")); // true
```

20. padStart(targetLength, padString)

- 在字符串开头填充指定的字符,直到字符串达到指定的长度。
```javascript
const str = "5";
console.log(str.padStart(3, "0")); // "005"
```

21. padEnd(targetLength, padString)

- 在字符串末尾填充指定的字符,直到字符串达到指定的长度。
```javascript
const str = "5";
console.log(str.padEnd(3, "0")); // "500"
```

22. repeat(count)

- 返回重复指定次数的字符串。
```javascript
const str = "Hello";
console.log(str.repeat(3)); // "HelloHelloHello"
```

23. search(regexp)

- 搜索字符串中与正则表达式匹配的子字符串,返回匹配的索引。
```javascript
const str = "Hello World";
console.log(str.search(/World/)); // 6
```

24. substr(startIndex, length)

- 从指定位置开始提取指定长度的子字符串。
```javascript
const str = "Hello World";
console.log(str.substr(6, 5)); // "World"
```

25. valueOf()

- 返回字符串对象的原始值。
```javascript
const str = new String("Hello");
console.log(str.valueOf()); // "Hello"
```

这些方法为处理字符串提供了强大的功能,能够满足大多数字符串操作的需求。在实际开发中,根据具体场景选择合适的方法可以大大提高代码的效率和可读性。

上次更新:

相关文章

npx完全指南:前端开发必备工具详解 | 20年架构师深度解析

本文由20年前端架构师深入解析npx工具,涵盖其核心功能、优势、高级用法、最佳实践及与npm/yarn的区别比较,帮助开发者掌握这一现代前端开发利器。

·前端开发

<处理关联数据的最佳实践:Article 与 Tags 的关系 | 开发指南>

<本文详细介绍了在开发中处理关联数据(如 Article 和 Tags 的多对多关系)的最佳实践,包括拆分业务逻辑、使用事务保证数据一致性、合理设计关联表结构、批量操作、幂等性和乐观锁等关键要点,并提供了基于 mysql2 和 Sequelize 的代码示例。>

·后端开发

Astro 静态站点生成器:构建高性能网站的最佳选择

Astro 是一个专注于构建快速、轻量级网站的静态站点生成器,支持多种前端框架,采用岛屿架构减少 JavaScript 加载,提升性能。

·前端开发

MySQL外键约束详解:维护数据一致性与完整性

本文详细介绍了MySQL中的外键约束(Foreign Key Constraint),包括其基本概念、创建方法、作用、级联操作、限制、修改与删除方法、查看方式以及最佳实践。通过合理使用外键约束,可以有效管理数据库中的数据关系,确保数据的准确性和可靠性。

·后端开发

MySQL JSON数据类型支持与使用指南 | 详细解析与示例

本文详细解析了MySQL从5.7版本开始支持的JSON数据类型,包括版本支持、创建JSON字段、插入与查询JSON数据、修改JSON数据、生成JSON、索引优化、性能与应用场景、注意事项及示例全流程。

·后端开发

SQL JOIN、LEFT JOIN 和 RIGHT JOIN 的区别与应用场景详解

本文详细介绍了 SQL 中 JOIN、LEFT JOIN 和 RIGHT JOIN 的区别,包括它们的作用、语法、示例以及实际应用场景,帮助读者更好地理解和使用这些连接方式。

·后端开发

Weex 跨平台移动开发框架:核心特性与使用指南

Weex 是由阿里巴巴开源的跨平台移动开发框架,支持使用 Vue.js 或 Rax 构建高性能的 iOS、Android 和 Web 应用。本文详细解析了 Weex 的核心特性、架构、工作流程、组件和模块、开发工具、优缺点、应用场景及未来发展。

·前端开发

ECharts 与 DataV 数据可视化工具对比分析 | 选择指南

本文详细对比了 ECharts 和 DataV 两个常用的数据可视化工具,包括它们的设计目标、优缺点、使用场景和技术栈,帮助读者根据具体需求选择合适的工具。

·前端开发

前端部署后通知用户刷新页面的常见方案 | 单页应用更新提示

本文介绍了在前端部署后通知用户刷新页面的几种常见方案,包括WebSocket实时通知、轮询检查版本、Service Worker版本控制、版本号对比、自动刷新、使用框架内置功能以及第三方库。每种方案的优缺点和示例代码均有详细说明。

·前端开发

TypeScript 映射类型常见问题与解决方案 | 提升代码维护性

本文探讨了在使用 TypeScript 时,映射类型的不当使用可能导致的问题,如代码难以维护、类型推断不准确或性能问题,并提供了相应的解决方案和最佳实践。

·编程语言