『JavaScript』深入理解JavaScript字符串的基础操作与内置方法

发布时间:2023年12月26日

请添加图片描述

请添加图片描述
📣读完这篇文章里你能收获到

  • 学习了JavaScript中字符串的基本操作
  • 掌握了JavaScript字符串的多种内置方法
  • 了解了JavaScript中的模板字符串和插值表达式
  • 熟悉了如何在JavaScript中使用正则表达式与字符串方法结合

请添加图片描述


在JavaScript中,字符串是一个不可变的字符序列,这意味着一旦创建了一个字符串,就不能改变其内容。本文将详细介绍JavaScript中的字符串技术,包括基本操作、方法和一些实用技巧。

一、基本操作

1. 创建字符串

在JavaScript中,可以使用以下方式创建字符串:

let str1 = "Hello, World!";
let str2 = 'This is a string';
let str3 = `Template literal`;

2. 字符串长度

使用length属性可以获得字符串的长度:

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

3. 字符访问

可以使用方括号[]来访问字符串中的单个字符:

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

注意:JavaScript中的字符串索引是从0开始的。

二、字符串方法

JavaScript为字符串提供了一系列内置方法,以下是一些常用的方法:

方法名描述
charAt(index)返回指定位置的字符
charCodeAt(index)返回指定位置的字符的Unicode编码
concat(string2, …, stringN)连接一个或多个字符串,并返回新的字符串
indexOf(searchValue[, fromIndex])返回指定子字符串首次出现的索引,未找到则返回-1
lastIndexOf(searchValue[, fromIndex])返回指定子字符串最后一次出现的索引,未找到则返回-1
includes(searchString[, position])检查字符串是否包含指定的子字符串,返回布尔值
startsWith(searchString[, position])检查字符串是否以指定的子字符串开头,返回布尔值
endsWith(searchString[, endPosition])检查字符串是否以指定的子字符串结尾,返回布尔值
slice(start[, end])提取字符串的一部分,并返回新的字符串
substring(start[, end])提取字符串的一部分,并返回新的字符串
toLowerCase()将字符串转换为小写
toUpperCase()将字符串转换为大写
trim()删除字符串两侧的空白字符
trimStart()删除字符串左侧的空白字符(ES2019)
trimEnd()删除字符串右侧的空白字符(ES2019)
split(separator[, limit])使用指定的分隔符将字符串分割成数组
`replace(regexpsubstr, newSubstr

以下是一些示例代码:

let str = "Hello, World!";

console.log(str.charAt(0)); // 输出:H
console.log(str.charCodeAt(0)); // 输出:72
console.log(str.concat(" How are you?")); // 输出:Hello, World! How are you?
console.log(str.indexOf("World")); // 输出:7
console.log(str.lastIndexOf("o")); // 输出:8
console.log(str.includes("World")); // 输出:true
console.log(str.startsWith("Hello")); // 输出:true
console.log(str.endsWith("!")); // 输出:true
console.log(str.slice(7, 12)); // 输出:World
console.log(str.substring(7, 12)); // 输出:World
console.log(str.toLowerCase()); // 输出:hello, world!
console.log(str.toUpperCase()); // 输出:HELLO, WORLD!
console.log(str.trim()); // 输出:Hello, World!
console.log(str.split(" ")); // 输出:["Hello,", "World!"]
console.log(str.replace("World", "Everyone")); // 输出:Hello, Everyone!

三、实用技巧

1. 字符串模板

在ES6中引入了模板字符串(Template literals),它使用反引号(`)而不是单引号或双引号来定义字符串。模板字符串可以包含插值表达式,这些表达式会被它们的值替换。

let name = "John";
let greeting = `Hello, ${name}!`; // 输出:Hello, John!

2. 正则表达式

JavaScript中的字符串方法可以与正则表达式一起使用,进行复杂的字符串操作和匹配。

let str = "The quick brown fox jumps over the lazy dog.";

let matches = str.match(/fox/); // 输出:["fox"]
let replaced = str.replace(/the/gi, "that"); // 输出:That quick brown fox jumps over that lazy dog.

请添加图片描述

请添加图片描述

文章来源:https://blog.csdn.net/qq_34202873/article/details/135232057
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。