当前位置：首页 > article >正文

【3.5JavaScript】JavaScript字符串对象

article 2026/4/11 10:45:10

文章目录

- 1.获取字符串长度
- 2.大小写转换
- 3.获取某一个字符
- 4.截取字符串
- 5.替换字符串
- 6.分割字符串
- 7.检索字符串位置
- 8.例题：统计某一个字符的个数

在 JavaScript 中，对象是非常重要的知识点。对象分为两种：一种是 ”自定义对象“，另一种是 ”内置对象“。

自定义对象，指的是需要我们自己定义的对象，跟 ”自定义函数“ 是一样的道理

内置对象，指的是系统已经定义好的、可以直接使用的对象，跟 ”内置函数“ 也是一样的道理

在初学阶段，我们先来学习内置对象，然后在进阶的时候再去学习自定义对象。在 JavaScript 中，常用的内置对象有四种

字符串对象：String
数组对象：Array
日期对象：Date
数值对象：Math

这一节我们先来学习一下字符串对象的常用属性和方法

1.获取字符串长度

字符串名.length

举例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>var str = "i love you";str.length;document.write(str.length);</script>
</head>
<body>
</body>
</html>

2.大小写转换

字符串名.toLowerCase()
字符串名.toUpperCase()

举例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>var str = "I Love You";document.write("正常：" + str + "<br>");document.write("大写：" +str.toUpperCase() + "<br>");document.write("小写：" +str.toLowerCase());</script>
</head>
<body>
</body>
</html>

3.获取某一个字符

字符串名.charAt()

举例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>var str = "I Love You";document.write(str.charAt(0) + "<br>");document.write(str.charAt(1) + "<br>");document.write(str.charAt(2) + "<br>");</script>
</head>
<body>
</body>
</html>

4.截取字符串

截取范围为：[ start , end )

字符串的下标是从 0 开始数的

字符串名.substring(start, end)

举例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>var str = "I Love You";var str2 = str.substring(2, 8);document.write(str2);</script>
</head>
<body>
</body>
</html>

5.替换字符串

字符串名.replace(原字符串, 替换字符串)
字符串名.replace(正则表达式, 替换字符串)

举例：

直接使用字符串替换：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>var str = "I Love You";var str2 =  str.replace("Love","Hate");document.write(str2);</script>
</head>
<body>
</body>
</html>

使用正则表达式替换：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>var str = "I Love You ， He Love You ， She Love You";var str2 =  str.replace("Love","Hate");var str3 =  str.replace(/Love/g,"Hate");document.write(str2);document.write("<br>");document.write(str3);</script>
</head>
<body>
</body>
</html>

注意：使用 replace 进行替换时，只会替换匹配到的第一个，而正则表达式会将所有匹配到的进行替换

6.分割字符串

字符串名.split("分隔符")

举例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>var str = "I Love You ，He Love You ，She Love You";var arr = str.split("，");document.write(arr[0] + "<br>");document.write(arr[1] + "<br>");document.write(arr[2] + "<br>");document.write(arr[3] + "<br>");</script>
</head>
<body>
</body>
</html>

7.检索字符串位置

indexOf() 方法找到指定字符串中 “首次出现” 的下标位置

lastIndexOf()方法找到指定字符串中“最后出现”的下标位置

字符串名.indexOf(指定字符串)
字符串名.lastIndexOf(指定字符串)

如果字符串中不包含 “指定字符串” 就会返回 -1

举例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>var str = "I Love You ，He Love You ，She Love You";document.write(str.indexOf("Love")); // 2document.write("<br>");document.write(str.lastIndexOf("Love")); // 29document.write("<br>");document.write(str.lastIndexOf("love")); // -1</script>
</head>
<body>
</body>
</html>

8.例题：统计某一个字符的个数

找出并计算字符串"Can you can a can as a canner can can a can?"中所有 c 的个数，不区分大小写

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>var str = "Can you can a can as a canner can can a can?";var n = 0;for (var i = 0; i < str.length; i++) {if (str.charAt(i).toLowerCase() == "c") {n++;}}document.write("字符串中包含 " + n + " 个c");</script>
</head>
<body>
</body>
</html>

【3.5JavaScript】JavaScript字符串对象

文章目录 1.获取字符串长度2.大小写转换3.获取某一个字符4.截取字符串5.替换字符串6.分割字符串7.检索字符串位置8.例题：统计某一个字符的个数在 JavaScript 中，对象是非常重要的知识点。对象分为两种：一种是 ”自定义对象“，另…...

编程日记 2026/4/3 7:21:11

Apache Flink架构深度解析：任务调度、算子数据同步与TaskSlot资源管理机制

Apache Flink是一个分布式流处理框架，其核心架构设计围绕有界与无界数据流的统一处理能力展开。以下从任务分配、算子数据同步、TaskManager与JobManager的TaskSlot机制三个维度展开详细分析： 一、任务分配机制 Flink的任务分配基于并行度（P…...

编程日记 2025/6/23 19:40:19

路由基本配置

学习目标 • 根据拓扑图进行网络布线。 • 清除启动配置并将路由器重新加载为默认状态。 • 在路由器上执行基本配置任务。 • 配置并激活以太网接口。 • 测试并检验配置。 • 思考网络实施方案并整理成文档。任务 1：网络布线使用适当的电缆类型连接网络设备。…...

编程日记 2026/4/9 20:09:37

windows上vscode cmake工程搭建

安装vscode插件： 1.按装fastc（主要是安装MinGW\mingw64比较方便） 2.安装C，cmake，cmake tools插件 3.准备工作完成之后，按F1，选择cmake:Quick Start就可以创建一个cmake工程。 4.设置Cmake: G…...

编程日记 2026/4/10 19:22:51

VUE3+TS+element-plus项目从0开始入门 - 创建项目、认识基本结构

文章目录写在前面1、创建vue3项目npm create vuelatestnpm i 2、项目结构.vscodevue3结构a、项目树结构b、package.jsonc、tsconfig.jsond、index.htmld、srce、main.tsf、App.vue 写在前面开前请自行下载vs code、node.js, 在vs code里面安装Vue - Official插件。本文使用的…...

编程日记 2026/4/10 14:44:49

shared_ptr 不析构的问题记录

片段1： 片段2： 你们猜哪个有问题 ？...

编程日记 2026/3/16 20:39:50

DeepSeek模型量化

技术背景大语言模型（Large Language Model，LLM），可以通过量化（Quantization）操作来节约内存/显存的使用，并且降低了通讯开销，进而达到加速模型推理的效果。常见的就是把Float16的浮…...

编程日记 2026/1/22 11:11:46

原生稀疏注意力机制(NSA)：硬件对齐且可原生训练的稀疏注意力机制-论文阅读

摘要长上下文建模对于下一代语言模型至关重要，但标准注意力机制的高计算成本带来了巨大的计算挑战。稀疏注意力提供了一种在保持模型能力的同时提高效率的有前途的方向。本文提出了一种名为 NSA（原生可训练稀疏注意力机制） 的方法&#xff…...

编程日记 2026/4/11 1:30:55

从0到1：固件分析

固件分析 0x01 固件提取 1、从厂商官网下载例如D-link的固件： https://support.dlink.com/resource/products/ 2、代理或镜像设备更新时的流量发起中间人攻击MITM #启用IP转发功能 echo 1 > /proc/sys/net/ipv4/ip_forward#配置iptables，将目…...

编程日记 2026/4/8 8:38:29

Zookeeper（58）如何在Zookeeper中实现分布式锁？

在 Zookeeper 中实现分布式锁是一种常见的用例。Zookeeper 提供了强一致性、高可用性的分布式协调服务，使得它非常适合用来实现分布式锁。以下是详细的步骤和代码示例，展示如何在 Zookeeper 中实现分布式锁。 1. Zookeeper 分布式锁的基本原理 Zookeep…...

编程日记 2025/6/24 9:13:57

23种设计模式 - 观察者模式

模式定义观察者模式（Observer Pattern）是一种行为型设计模式，定义了一对多的依赖关系：当一个对象（称为主题）状态变化时，所有依赖它的对象（称为观察者）会自动收到通知并…...

编程日记 2025/11/13 6:14:13

conda、anaconda、pip、pytorch、tensorflow有什么区别？

先画一张图，可以大致看出它们的区别和关联： pytorch、tensorflow都是Python的第三方库，相当于封装的代码工具集库，通过import导入使用。这两个都是深度学习框架，用来搭建AI模型什么的，使用范围非常之广&…...

编程日记 2026/4/8 4:30:59

项目设置内网 IP 访问实现方案

在我们平常的开发工作中，项目开发、测试完成后进行部署上线。比如电商网站、新闻网站、社交网站等，通常对访问不会进行限制。但是像企业内部网站、内部管理系统等，这种系统一般都需要限制访问，比如内网才能访问等。那么一个网站应…...

编程日记 2026/4/5 12:29:15

Vue面试2

1.跨域问题以及如何解决跨域跨域问题（Cross-Origin Resource Sharing, CORS）是指在浏览器中，当一个资源试图从一个不同的源请求另一个资源时所遇到的限制。这种限制是浏览器为了保护用户安全而实施的一种同源策略（Same-origin p…...

编程日记 2026/4/6 6:58:40

合合信息2025届春季校园招聘全面启动！

世界因你而AI，合合信息2025届春季校园招聘启动！ 我们是谁？ 我们是一家行业领先的人工智能及大数据科技企业 18年深耕AI领域，C端产品与B端服务布局矩阵完善 9.4亿全球累计用户首次下载量💥 来到这里你能得到什么&a…...

编程日记 2026/4/10 7:13:08

如何利用 Vue 的生命周期钩子进行初始化和清理操作？

一、初始化操作的核心钩子 1. created（选项式API） export default {data() {return { user: null };},created() {// 适合初始化数据、发起非DOM操作请求this.fetchUser();},methods: {async fetchUser() {const response await fetch(/api/user);thi…...

编程日记 2026/2/19 2:08:25

Excell 代码处理

文章目录 Excell 代码处理cvc格式xlsl格式小结 Excell 代码处理有时候要对excell进行分析，或者数据的导入导出，这个时候如果可以用代码读写分析操作那么会方便很多 cvc格式 CSV（Comma-Separated Values，逗号分隔值）是…...

编程日记 2026/4/2 9:49:35

KMP的next数组构建详解

KMP的next数组构建详解 1. next数组的作用核心功能：在KMP算法中，当模式串与主串发生不匹配时，next数组决定模式串指针回退的位置，避免无效匹配。定义：next[i]表示子串s[0...i]的最长公共前后缀长度。例如&#xff…...

编程日记 2026/3/15 12:31:53

Docker 的安全配置与优化（二）

Docker 安全优化策略 （一）多阶段构建优化镜像大小多阶段构建是 Docker 17.05 版本引入的强大功能，它允许在一个 Dockerfile 中定义多个构建阶段，每个阶段都可以使用不同的基础镜像和依赖项，最终只将必要的文件和依赖…...

编程日记 2026/4/4 18:06:32

shiro代码层面追踪

文章目录环境漏洞分析硬编码反序列化Gadget构造环境环境搭建：https://blog.csdn.net/qq_44769520/article/details/123476443 漏洞分析硬编码 shiro是对rememberMe这个cookie进⾏反序列化的时候出现了问题。相应代码 // // Source code recreated from …...

编程日记 2026/4/11 7:32:35

通信系统中物理层与网络层联系与区别

在通信系统中，物理层和网络层是OSI（开放系统互连）模型中的两个重要层次，分别位于协议栈的最底层和第三层。它们在功能、职责和实现方式上有显著的区别，但同时也在某些方面存在联系。以下是物理层与网络层的联系与区别的…...

编程日记 2026/3/16 14:46:50

虚拟机网络ssh连接失败，没有网络

vscode进行ssh时连接失败，发现是虚拟机没有网络。虚拟机ping不通www.baidu.com但可以ping通内网 ping 8.8.8.8ping不通。 sudo dhclient -r ens33 sudo dhclient ens33 ip route show可以了。 20250221记录：不知道是不是重启了虚拟机还是咋了&#…...

编程日记 2026/4/5 20:41:47

已知点矩阵的三个顶点坐标、行列数和行列的间距，计算得出剩余所有点的坐标

已知点矩阵的三个顶点坐标、行列数和行列的间距，计算得出剩余所有点的坐标计算矩阵中每个点的坐标代码实现案例图调用验证计算矩阵中每个点的坐标给定左上角、左下角和右上角三个点的坐标，以及矩阵的行数、列数、行间距和列间距，我们可以…...

编程日记 2026/4/10 7:50:28

Python Cookbook-2.4 从文件中读取指定的行

任务根据给出的行号，从文本文件中读取一行数据。解决方案 Python标准库linecache模块非常适合这个任务: import linecache theline linecache.getline(thefilepath, desired_line_number)讨论对这个任务而言，标准的 linecache 模块是 Python 能…...

编程日记 2026/3/21 17:44:25

go 并发 gorouting chan channel select Mutex sync.One

goroutine // head： 前缀 index：是一个int的指针 func print(head string, index *int) {for i : 0; i < 5; i {// 指针对应的int *indexfmt.Println(*index, head, i)// 暂停1stime.Sleep(1 * time.Second)} }/* Go 允许使用 go 语句开启一个新的运…...

编程日记 2026/4/10 8:39:26

Unity游戏制作中的C#基础（3）加减乘除算术操作符，比较运算符，逻辑与，或运算符

1. 基本算术运算符算术运算符主要用于对数值类型（整型和浮点型）进行基本的数学运算。以下是常见的算术运算符及其说明： 运算符描述示例结果加法运算符，用于两个数相加，也可用于字符串连接int a 5 3; string str &…...

编程日记 2026/4/5 8:48:43

深度学习入门--python入门2

以前学的全忘了，现在算是才开始学，有错误，恳请指正。目录 1.4 Python脚本文件 1.4.1保存为文件 1.4.2 类 1.5 Numpy 1.5.1 导入Numpy 1.5.2 生成Numpy数组 1.5.3 Numpy的算术运算 1.5.4 Numpy的N维数组 1.5.5 广播 1.5.6 访问元素…...

编程日记 2026/4/5 21:27:54