JavaScript字符串的常用方法

简介: 在JavaScript中,字符串处理是一个非常常见的任务。JavaScript提供了丰富的字符串操作方法,使开发者能够高效地处理和操作字符串。本文将详细介绍JavaScript字符串的常用方法,并提供示例代码以便更好地理解和应用这些方法。

在JavaScript中,字符串处理是一个非常常见的任务。JavaScript提供了丰富的字符串操作方法,使开发者能够高效地处理和操作字符串。本文将详细介绍JavaScript字符串的常用方法,并提供示例代码以便更好地理解和应用这些方法。

字符串长度

获取字符串的长度是一个基本操作,可以使用 length属性。

let str = "Hello, World!";
console.log(str.length);  // 输出: 13
​

字符串查找

indexOf

indexOf方法用于查找子字符串在字符串中第一次出现的位置。

let str = "Hello, World!";
console.log(str.indexOf("World"));  // 输出: 7
​

lastIndexOf

lastIndexOf方法用于查找子字符串在字符串中最后一次出现的位置。

let str = "Hello, World! Hello!";
console.log(str.lastIndexOf("Hello"));  // 输出: 13
​

includes

includes方法用于检查字符串是否包含指定的子字符串。

let str = "Hello, World!";
console.log(str.includes("World"));  // 输出: true
​

startsWith

startsWith方法用于检查字符串是否以指定的子字符串开始。

let str = "Hello, World!";
console.log(str.startsWith("Hello"));  // 输出: true
​

endsWith

endsWith方法用于检查字符串是否以指定的子字符串结束。

let str = "Hello, World!";
console.log(str.endsWith("World!"));  // 输出: true
​

字符串提取

slice

slice方法用于提取字符串的子字符串,接受两个参数:起始索引和结束索引。

let str = "Hello, World!";
console.log(str.slice(7, 12));  // 输出: World
​

substring

substring方法也用于提取子字符串,但与 slice不同,它不接受负索引。

let str = "Hello, World!";
console.log(str.substring(7, 12));  // 输出: World
​

substr

substr方法用于从指定位置开始提取一定长度的子字符串。

let str = "Hello, World!";
console.log(str.substr(7, 5));  // 输出: World
​

字符串修改

replace

replace方法用于替换字符串中的子字符串。它只替换第一次匹配的子字符串。

let str = "Hello, World!";
let newStr = str.replace("World", "JavaScript");
console.log(newStr);  // 输出: Hello, JavaScript!
​

replaceAll

replaceAll方法用于替换字符串中的所有匹配子字符串。

let str = "Hello, World! World!";
let newStr = str.replaceAll("World", "JavaScript");
console.log(newStr);  // 输出: Hello, JavaScript! JavaScript!
​

toUpperCase

toUpperCase方法将字符串转换为大写。

let str = "Hello, World!";
console.log(str.toUpperCase());  // 输出: HELLO, WORLD!
​

toLowerCase

toLowerCase方法将字符串转换为小写。

let str = "Hello, World!";
console.log(str.toLowerCase());  // 输出: hello, world!
​

trim

trim方法用于去除字符串两端的空白字符。

let str = "   Hello, World!   ";
console.log(str.trim());  // 输出: Hello, World!
​

trimStarttrimEnd

trimStarttrimEnd方法用于去除字符串开头和结尾的空白字符。

let str = "   Hello, World!   ";
console.log(str.trimStart());  // 输出: Hello, World!   
console.log(str.trimEnd());    // 输出:    Hello, World!
​

字符串拆分和连接

split

split方法用于将字符串拆分成数组。

let str = "Hello, World!";
let arr = str.split(", ");
console.log(arr);  // 输出: ["Hello", "World!"]
​

concat

concat方法用于连接两个或多个字符串。

let str1 = "Hello";
let str2 = "World";
let str3 = str1.concat(", ", str2, "!");
console.log(str3);  // 输出: Hello, World!
​

字符访问

charAt

charAt方法用于返回指定索引处的字符。

let str = "Hello, World!";
console.log(str.charAt(7));  // 输出: W
​

charCodeAt

charCodeAt方法用于返回指定索引处字符的Unicode值。

let str = "Hello, World!";
console.log(str.charCodeAt(7));  // 输出: 87
​

at

at方法用于返回字符串中指定位置的字符,支持负索引。

let str = "Hello, World!";
console.log(str.at(7));  // 输出: W
console.log(str.at(-1)); // 输出: !
​

分析说明表

方法 作用 示例代码
length 获取字符串长度 str.length
indexOf 查找子字符串首次出现位置 str.indexOf("World")
lastIndexOf 查找子字符串最后出现位置 str.lastIndexOf("Hello")
includes 检查字符串是否包含子字符串 str.includes("World")
startsWith 检查字符串是否以子字符串开始 str.startsWith("Hello")
endsWith 检查字符串是否以子字符串结束 str.endsWith("World!")
slice 提取子字符串 str.slice(7, 12)
substring 提取子字符串 str.substring(7, 12)
substr 从指定位置提取一定长度的子字符串 str.substr(7, 5)
replace 替换子字符串 str.replace("World", "JavaScript")
replaceAll 替换所有匹配子字符串 str.replaceAll("World", "JavaScript")
toUpperCase 转换为大写 str.toUpperCase()
toLowerCase 转换为小写 str.toLowerCase()
trim 去除两端空白字符 str.trim()
trimStart 去除开头空白字符 str.trimStart()
trimEnd 去除结尾空白字符 str.trimEnd()
split 拆分成数组 str.split(", ")
concat 连接字符串 str1.concat(", ", str2, "!")
charAt 返回指定索引处字符 str.charAt(7)
charCodeAt 返回指定索引处字符的Unicode值 str.charCodeAt(7)
at 返回指定位置字符,支持负索引 str.at(7)str.at(-1)
目录
相关文章
|
2月前
|
JavaScript 前端开发 程序员
前端原生Js批量修改页面元素属性的2个方法
原生 Js 的 getElementsByClassName 和 querySelectorAll 都能获取批量的页面元素,但是它们之间有些细微的差别,稍不注意,就很容易弄错!
|
2月前
|
Web App开发 JavaScript 前端开发
如何确保 Math 对象的方法在不同的 JavaScript 环境中具有一致的精度?
【10月更文挑战第29天】通过遵循标准和最佳实践、采用固定精度计算、进行全面的测试与验证、避免隐式类型转换以及持续关注和更新等方法,可以在很大程度上确保Math对象的方法在不同的JavaScript环境中具有一致的精度,从而提高代码的可靠性和可移植性。
|
3月前
|
缓存 监控 前端开发
JavaScript 实现大文件上传的方法
【10月更文挑战第17天】通过以上步骤和方法,我们可以实现较为可靠和高效的大文件上传功能。当然,具体的实现方式还需要根据实际的应用场景和服务器要求进行调整和优化。
|
2月前
|
监控 JavaScript Java
Node.js中内存泄漏的检测方法
检测内存泄漏需要综合运用多种方法,并结合实际的应用场景和代码特点进行分析。及时发现和解决内存泄漏问题,可以提高应用的稳定性和性能,避免潜在的风险和故障。同时,不断学习和掌握内存管理的知识,也是有效预防内存泄漏的重要途径。
154 52
|
2月前
|
JavaScript 前端开发 索引
js中DOM的基础方法
【10月更文挑战第31天】这些DOM基础方法是操作网页文档结构和实现交互效果的重要工具,通过它们可以动态地改变页面的内容、样式和行为,为用户提供丰富的交互体验。
|
2月前
|
缓存 JavaScript UED
js中BOM中的方法
【10月更文挑战第31天】
|
2月前
|
缓存 JavaScript 前端开发
JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用
本文深入讲解了 JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用。
58 5
|
2月前
|
JavaScript 前端开发 数据处理
模板字符串和普通字符串在浏览器和 Node.js 中的性能表现是否一致?
综上所述,模板字符串和普通字符串在浏览器和 Node.js 中的性能表现既有相似之处,也有不同之处。在实际应用中,需要根据具体的场景和性能需求来选择使用哪种字符串处理方式,以达到最佳的性能和开发效率。
|
2月前
|
JavaScript 前端开发 索引
JavaScript学习第二章--字符串
本文介绍了JavaScript中的字符串处理,包括普通字符串和模板字符串的使用方法及常见字符串操作方法如`charAt`、`concat`、`endsWith`等,适合前端学习者参考。作者是一位热爱前端技术的大一学生,专注于分享实用的编程技巧。
34 2
|
2月前
|
JavaScript 前端开发
js中的bind,call,apply方法的区别以及用法
JavaScript中,`bind`、`call`和`apply`均可改变函数的`this`指向并传递参数。其中,`bind`返回一个新函数,不立即执行;`call`和`apply`则立即执行,且`apply`的参数以数组形式传递。三者在改变`this`指向及传参上功能相似,但在执行时机和参数传递方式上有所区别。
32 1