JavaScript |(四)正则表达式 | 尚硅谷JavaScript基础实战

学习来源:尚硅谷JavaScript基础&实战丨JS入门到精通全套完整版

文章目录

  • 📚正则表达式
  • 📚正则表达式字面量方式
  • 📚字符串&正则表达式
    • 🐇split()
    • 🐇search()
    • 🐇match()
    • 🐇replace()
  • 📚正则表达式相关语法
    • 🐇量词
    • 🐇检查开头结尾
    • 🐇手机号规则
    • 🐇邮件检测
    • 🐇检测字符

📚正则表达式

  • 正则表达式用于定义一些字符串的规则,计算机可以根据正则表达式,来检查一个字符串是否符合规则,或者将字符串中符合规则的内容提取出来。
  • 创建正则表达式的对象var 变量 = new RegExp("正则表达式","匹配模式");,例如:var reg = new RegExp("a");这个正则表达式可以来检查一个字符串中是否含有a。
  • 使用typeof检查正则对象,会返回object。
  • test()方法:这个方法可以用来检查一个字符串是否符合正则表达式的规则,如果符合则返回true,否则返回false。
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			//建一个忽略大小写的正则表达式对象,匹配模式为 "ab"
			var reg = new RegExp("ab","i");
			var str = "a";
			var result = reg.test(str);
			// ​"ab"​ 中的 ​"b"​ 并不在字符串 ​"a"​ 中存在,以下同理
			console.log(result);//false
			console.log(reg.test("Ac"));//false
		</script>
	</head>
	<body>
	</body>
</html>

📚正则表达式字面量方式

  • 语法:var 变量 = /正则表达式/匹配模式
  • 使用字面量的方式创建更加简单,使用构造函数创建更加灵活。
  • []里的内容也是或的关系
    • [ab] == a|b
    • [a-z] 任意小写字母
    • [A-Z] 任意大写字母
    • [A-z] 任意字母
    • [0-9] 任意数字
    • [^ ] 除了
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			//var reg = new RegExp("a","i");
			var reg = /a/i;
			console.log(reg.test("abc"));//true
			
			//创建一个正则表达式,检查一个字符串中是否有a或b
			//使用 | 表示或者的意思
			reg = /a|b|c/;
			
			//创建一个正则表达式检查一个字符串中是否有字母
			reg = /[A-z]/;
			
			//检查一个字符串中是否含有 abc 或 adc 或 aec
			reg = /a[bde]c/;
			
			//[^ ] 除了
			reg = /[^ab]/;
			reg = /[^0-9]/;
			//包含字母"a",而不仅仅是数字
			console.log(reg.test("12a3456"));//true
		</script>
	</head>
	<body>
	</body>
</html>

📚字符串&正则表达式

🐇split()

  • 可以将一个字符串拆分为一个数组。
  • 方法中可以传递一个正则表达式作为参数,这样方法将会根据正则表达式去拆分字符串。
  • 这个方法即使不指定全局匹配,也会全都插分。
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			var str = "1a2b3c4d5e6f7";
			//根据任意字母来将字符串拆分
			var result = str.split(/[A-z]/);
			console.log(result);
	</script>
	</head>
	<body>
	</body>
</html>

在这里插入图片描述

🐇search()

  • 可以搜索字符串中是否含有指定内容
  • 如果搜索到指定内容,则会返回第一次出现的索引,如果没有搜索到返回-1。
  • 它可以接受一个正则表达式作为参数,然后会根据正则表达式去检索字符串。
  • serach()只会查找第一个,即使设置全局匹配也没用。
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			str = "hello abc hello aec afc";
			//搜索字符串中是否含有abc 或 aec 或 afc
			result = str.search(/a[bef]c/);
			console.log(result);//6
		</script>
	</head>
	<body>
	</body>
</html>

🐇match()

  • 可以根据正则表达式,从一个字符串中将符合条件的内容提取出来
  • 默认情况下我们的match只会找到第一个符合要求的内容,找到以后就停止检索。
  • 我们可以设置正则表达式为全局匹配模式,这样就会匹配到所有的内容
  • 可以为一个正则表达式设置多个匹配模式,且顺序无所谓。
  • match()会将匹配到的内容封装到一个数组中返回,即使只查询到一个结果。
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			str = "1a2a3a4a5e6f7A8B9C";
			result = str.match(/[a-z]/ig);
			console.log(result);
		</script>
	</head>
	<body>
	</body>
</html>

在这里插入图片描述

🐇replace()

  • 可以将字符串中指定内容替换为新的内容
  • 参数
    • 1.被替换的内容,可以接受一个正则表达式作为参数
    • 2.新的内容
    • 默认只会替换第一个
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			str = "1a2a3a4a5e6f7A8B9C";
			result = str.replace(/[a-z]/gi , "@_@");
			console.log(result);
			//1@_@2@_@3@_@4@_@5@_@6@_@7@_@8@_@9@_@
		</script>
	</head>
	<body>
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script type="text/javascript">
			var str = prompt("请输出任意的内容:");
			str = str.split("").reverse().join("");
			alert(str);
		</script>
	</head>
	<body>
	</body>
</html>

在这里插入图片描述
在这里插入图片描述

📚正则表达式相关语法

🐇量词

  • 通过量词可以设置一个内容出现的次数
  • 量词只对它前边的一个内容起作用
  • {n} 正好出现n次
  • {m,n} 出现m~n次
  • {m,} m次以上
  • + 至少一个,相当于{1,}
  • * 0个或多个,相当于{0,}
  • ? 0个或1个,相当于{0,1}
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			// 创建一个正则表达式检查一个字符串中是否含有aaa
			var reg = /a{3}/;
			// false,"abbc"中不含有连续的三个'a'
			console.log(reg.test("abbc")); 
			// true,"aaabbc"中含有连续的三个'a'
			console.log(reg.test("aaabbc")); 

			reg = /ab{1,3}c/;
			// true,"abaabbc"中含有'a'后跟着1到3个'b',再后是'c'
			console.log(reg.test("abaabbc")); 

			reg = /a{3,}c/;
			// false,"aaabbc"中含有连续的三个'a',但接着是'b'
			console.log(reg.test("aaabbc")); 

			reg = /ab+c/;
			// true,"aaabbc"中含有'a'后跟着至少一个'b',再后是'c'
			console.log(reg.test("aaabbc")); 

			reg = /ab*c/;
			// true,"aaabbc"中含有'a'后跟着任意个'b'(可能是0个),再后是'c'
			console.log(reg.test("aaabbc")); 

			// false,"aaabbc"中含有'a',但后跟着不是0或1个'b',再后是'c'
			reg = /ab?c/;
			console.log(reg.test("aaabbc")); 
		</script>
	</head>
	<body>
	</body>
</html>

🐇检查开头结尾

  • ^ 表示开头
  • $ 表示结尾
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			reg = /^a/; //匹配开头的a
			console.log(reg.test("abcabca"));//true
			reg = /a$/; //匹配结尾的a
			console.log(reg.test("abcabca"));//true
			//如果在正则表达式中同时使用^ $则要求字符串必须完全符合正则表达式
			reg = /^a$/;
			console.log(reg.test("bbca"));//false
		</script>
	</head>
	<body>
	</body>
</html>

🐇手机号规则

  1. 以1开头
  2. 第二位3-9任意数字
  3. 三位以后任意数字9个

^1 [3-9] [0-9]{9}$

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			//创建一个正则表达式,用来检查一个字符串是否是一个合法手机号
			var Str = "13067890123";
			var Str2 = "12345678909"
			var phoneReg = /^1[3-9][0-9]{9}$/;
			console.log(phoneReg.test(Str));//true
			console.log(phoneReg.test(Str2));//false
		</script>
	</head>
	<body>
	</body>
</html>

🐇邮件检测

  • 任意字母数字下划线 .任意字母数字下划线 @ 任意字母数字 .任意字母(2-5位) .任意字母(2-5位)
  • \w{3,} (\.\w+)* @ [A-z0-9]+ (\.[A-z]{2,5}){1,2}
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			var emailReg = /^\w{3,}(\.\w+)*@[A-z0-9]+(\.[A-z]{2,5}){1,2}$/;
			var email = "abc.hello@163.com";
			console.log(emailReg.test(email));//true
		</script>
	</head>
	<body>
	</body>
</html>

🐇检测字符

  • . 表示任意字符
  • 在正则表达式中使用\作为转义字符,\. 来表示.\\ 表示\
  • 注意:使用构造函数时,由于它的参数是一个字符串,而****是字符串中转义字符,如果要使用\则需要使用\\来代替。
  • \w:任意字母、数字,_ [A-z0-9_]
  • \W:除了字母、数字,_ [^A-z0-9_]
  • \d:任意的数字, [0-9]
  • \D:除了数字, [^0-9]
  • \s:空格
  • \S:除了空格
  • \b:单词边界
  • \B:除了单词边界
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			//创建一个正则表达式检查一个字符串中是否含有单词child
			reg = /\bchild\b/;
			console.log(reg.test("hello child "));
			
			//接收一个用户的输入
			var str = prompt("请输入你的用户名:");
			//去除空格
			str = str.replace(/\s/g , "");
			console.log(str);
			//去除开头的空格
			//str = str.replace(/^\s*/, "");
			//去除结尾的空格
			//str = str.replace(/\s*$/, "");
		</script>
	</head>
	<body>
	</body>
</html>

在这里插入图片描述
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/59422.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Vue3_语法糖—— <script setup>以及unplugin-auto-import自动引入插件

<script setup>import { ref , onMounted} from vue;let obj ref({a: 1,b: 2,}); let changeObj ()>{console.log(obj)obj.value.c 3 //ref写法}onMounted(()>{console.log(obj)})</script> 里面的代码会被编译成组件 setup() 函数的内容。 相当于 <…

牛客网Verilog刷题——VL51

牛客网Verilog刷题——VL51 题目答案 题目 请编写一个十六进制计数器模块&#xff0c;计数器输出信号递增每次到达0&#xff0c;给出指示信号zero&#xff0c;当置位信号set 有效时&#xff0c;将当前输出置为输入的数值set_num。模块的接口信号图如下&#xff1a; 模块的时序图…

Redis的Java客户端

目录 1.Jedis的使用 前置工作-ssh进行端口转发 JedisAPI的使用 Jedis连接池 2.SpringDataRedis的使用 1.创建项目 2.配置文件 3.注入RedisTemplate对象 4.编写代码 3.SpringRedisTemplate 哈希结构用法 ​总结 1.Jedis的使用 Jedis&#xff1a;以Redis命令作为方法…

mysql重置和修改密码 Ubuntu系统

忘记密码要重置密码 cat /etc/mysql/debian.cnf/etc/mysql/debian.cnf这个只有Debian或者Ubuntu服务器才有&#xff0c;里面有mysql安装后自带的用户&#xff0c;作用就是重启及运行mysql服务。我们用这个用户登录来达到重置密码的操作 使用上面的那个文件中的用户名和密码登…

强化学习分享(一) DQN算法原理及实现

摘要&#xff1a;主要讲解DQN算法的原理&#xff0c;伪代码解读&#xff0c;基于pytorch版本的DQN小游戏编程&#xff0c;同时对该代码进行详细标注&#xff0c;以及奉上原码。 &#xff08;一&#xff09;强化学习算法介绍 DQN&#xff0c;顾名思义&#xff0c;Deep Q Learni…

SpringCloud《Eureka、Ribbon、Feign、Hystrix、Zuul》作用简单介绍

概述 SpringCloud是一个全家桶&#xff0c;包含多个组件。 本文主要介绍几个重要组件&#xff0c;也就是Eureka、Ribbon、Feign、Hystrix、Zuul这几个组件。 一、业务场景介绍 业务流程&#xff0c;支付订单功能 订单服务改变为已支付订单服务调用库存服务&#xff0c;扣减…

中国农村程序员学习此【正则表达式进阶】发明cahtGPT,购买大平层,开上帕拉梅拉,迎娶白富美出任CEO走上人生巅峰

注&#xff1a;最后有面试挑战&#xff0c;看看自己掌握了吗 文章目录 限制可能的用户名匹配空白字符匹配非空白字符指定匹配的上限和下限只指定匹配的下限指定匹配的确切数量检查全部或无正向先行断言和负向先行断言检查混合字符组使用捕获组重用模式使用捕获组搜索和替换删除…

分类预测 | MATLAB实现WOA鲸鱼算法同步优化特征选择结合支持向量机分类预测

分类预测 | MATLAB实现WOA鲸鱼算法同步优化特征选择结合支持向量机分类预测 目录 分类预测 | MATLAB实现WOA鲸鱼算法同步优化特征选择结合支持向量机分类预测效果一览基本介绍程序设计参考资料 效果一览 基本介绍 MATLAB实现WOA鲸鱼算法同步优化特征选择结合支持向量机分类预测…

Windows 系统无法复制粘贴则么处理

Windows 系统无法复制粘贴如何恢复呢&#xff1f; 今天小编遇到一个问题&#xff0c;就是自己的电脑突然无法复制、粘贴&#xff0c;这样的问题我遇到很多次&#xff0c;重启电脑虽然能解决问题&#xff0c;但是不能一直通过重启来解决这样的问题&#xff0c;很浪费时间的。今…

Filebeat+ELK 部署

Node1节点&#xff08;2C/4G&#xff09;&#xff1a;node1/192.168.8.10 Elasticsearch Kibana Node2节点&#xff08;2C/4G&#xff09;&#xff1a;node2/192.168.8.11 Elasticsearch Apache节点&#xff1a;apache/192.168.8.13 …

2023年电赛---运动目标控制与自动追踪系统(E题)发挥题思路

前言 &#xff08;1&#xff09;因为博客编辑字数超过1W字会导致MD编辑器非常卡顿。所以我将发挥题和基础题的思路拆开了。 &#xff08;2&#xff09;更新日记&#xff1a; <1>2023年8月4日&#xff0c;9点20分。分离发挥题思路和基础题思路&#xff0c;增加了博主Huiye…

2020-2023中国高等级自动驾驶产业发展趋势研究

1.1 概念界定 2020-2023中国高等级自动驾驶产业发展趋势研究Trends in China High-level Autonomous Driving from 2020 to 2023自动驾驶发展过程中&#xff0c;中国出现了诸多专注于研发L3级以上自动驾驶的公司&#xff0c;其在业界地位也越来越重要。本报告围绕“高等级自动…

【雕爷学编程】MicroPython动手做(29)——物联网之SIoT 2

知识点&#xff1a;什么是掌控板&#xff1f; 掌控板是一块普及STEAM创客教育、人工智能教育、机器人编程教育的开源智能硬件。它集成ESP-32高性能双核芯片&#xff0c;支持WiFi和蓝牙双模通信&#xff0c;可作为物联网节点&#xff0c;实现物联网应用。同时掌控板上集成了OLED…

Java实现数据库表中的七种连接【Mysql】

Java实现数据库表中的七种连接【Mysql】 前言版权推荐Java实现数据库表中的七种连接左外连接右外连接其他连接 附录七种连接SQL测试Java测试转换方法类 Cla1类 Cla2类Cla3 最后 前言 2023-8-4 16:51:42 以下内容源自《【Mysql】》 仅供学习交流使用 版权 禁止其他平台发布时…

vue 混入(mixin)的使用

在 vue 组件内&#xff0c;如果想将一些公共功能&#xff0c;如组件、方法、钩子函数等复用&#xff0c;混入是一个很好的选择。 现在开始我们的混入使用吧 1、我们可以创建一个目录mixins&#xff0c;在创建一个comment.js文件如图&#xff1a; // 在 common.js 里写你想共享…

SQL 表别名 和 列别名

列表名 列表名之后 order by 可以用别名 也可以用原名&#xff0c; where 中不能用别名的 SQL语句执行顺序&#xff1a; from–>where–>group by -->having — >select --> order 第一步&#xff1a;from语句&#xff0c;选择要操作的表。 第二步&#xff1…

matlab编程实践18、19

浅水方程 浅水方程可以建立起海啸和浴缸中波浪的数学模型。浅水方程建立了水或者其它不可压缩液体受扰动时传播的模型。隐含的假设是&#xff0c;液体的深度和波浪的长度、扰动等相比是很小的。 在这样的记号下&#xff0c;浅水方程为双曲守恒定律的一个例子。 使用拉克斯-冯特…

ssm机动车维修站车辆维护管理系统java汽车报修备案jsp源代码mysql

本项目为前几天收费帮学妹做的一个项目&#xff0c;Java EE JSP项目&#xff0c;在工作环境中基本使用不到&#xff0c;但是很多学校把这个当作编程入门的项目来做&#xff0c;故分享出本项目供初学者参考。 一、项目描述 ssm机动车维修站车辆维护管理系统 系统有2权限&#…

iOS16.0:屏幕旋转

此文写于2022年08月03日&#xff0c;距离iOS16正式版推出还有一个多月的时间&#xff0c;iOS16 beta版本有很多API的修改&#xff0c;今天讨论的是屏幕旋转&#xff0c;基于Xcode 14.0 beta4。 之前的屏幕旋转会报错&#xff1a; [Orientation] BUG IN CLIENT OF UIKIT: Settin…

MinIO

MinIO 1.MinIO安装 Minio 是个基于 Golang 编写的开源对象存储服务&#xff0c;存储非结构化数据&#xff0c;如&#xff1a;图片&#xff0c;视频&#xff0c;音乐等 官网地址&#xff1a;https://min.io/ 中文地址&#xff1a;http://minio.org.cn 官网文档&#xff08; …