前端JavaScript入门-day08-正则表达式

news2024/11/26 11:00:55

(创作不易,感谢有你,你的支持,就是我前行的最大动力,如果看完对你有帮助,请留下您的足迹)

目录

介绍

语法 

元字符 

边界符 

量词 

字符类:

修饰符


介绍

正则表达式(Regular Expression)是用于匹配字符串中字符组合的模式。在 JavaScript中,正则表达式也是对象,通常用来查找、替换那些符合正则表达式的文本
正则表达式在 JavaScript中的使用场景:
例如验证表单:用户名表单只能输入英文字母、数字或者下划线, 昵称输入框中可以输入中文( 匹配 )    比如用户名: /^[a-z0-9_-]{3,16}$/
过滤掉页面内容中的一些敏感词( 替换 ),或从字符串中获取我们想要的特定部分( 提取 )等 

语法 

1. 定义正则表达式语法:

其中 / / 是正则表达式字面量

比如:

2.判断是否有符合规则的字符串: 

test() 方法 用来查看正则表达式与指定的字符串是否匹配

语法:
比如:
console.log(/哈/.test('哈')) // true
console.log(/哈/.test('哈哈')) // true
console.log(/哈/.test('二哈')) // true
如果正则表达式与指定的字符串匹配 ,返回true,否则false

3.检索(查找)符合规则的字符串:

exec() 方法 在一个指定字符串中执行一个搜索匹配
语法:
比如:
如果匹配成功,exec() 方法返回一个数组,否则返回null

元字符 

普通字符:
大多数的字符仅能够描述它们本身,这些字符称作普通字符,例如所有的字母和数字。
也就是说普通字符只能够匹配字符串中与它们相同的字符。
元字符(特殊字符)
是一些具有特殊含义的字符,可以极大提高了灵活性和强大的匹配功能。
比如,规定用户只能输入英文26个英文字母,普通字符的话 abcdefghijklm…..
但是换成元字符写法: [a-z]
为了方便记忆和学习,我们对众多的元字符进行了分类:
         边界符表示位置,开头和结尾,必须用什么开头,用什么结尾
        量词表示重复次数
        字符类比如 \d 表示 0~9

边界符 

正则表达式中的边界符(位置符)用来 提示字符所处的位置 ,主要有两个字符

如果 ^ 和 $ 在一起,表示必须是精确匹配。 

    console.log(/^哈/.test('哈')) // true
    console.log(/^哈/.test('哈哈')) // true
    console.log(/^哈/.test('二哈')) // flase
    console.log(/^哈$/.test('哈')) // true  只有这种情况为true 否则全是false
    console.log(/^哈$/.test('哈哈')) // false
    console.log(/^哈$/.test('二哈')) // false

量词 

量词用来 设定某个模式出现的次数 

注意: 逗号左右两侧千万不要出现空格

    //  量词 * 类似 >=0 次
    console.log(/^哈$/.test('哈')) // true
    console.log(/^哈*$/.test('')) // true
    console.log(/^哈*$/.test('哈')) // true
    console.log(/^哈*$/.test('哈哈')) // true
    console.log(/^哈*$/.test('二哈很傻')) //  false
    console.log(/^哈*$/.test('哈很傻')) //  false
    console.log(/^哈*$/.test('哈很哈')) // false
    console.log('------------------')
    //  量词 + 类似 >=1 次
    console.log(/^哈$/.test('哈')) // true
    console.log(/^哈+$/.test('')) // false
    console.log(/^哈+$/.test('哈')) // true
    console.log(/^哈+$/.test('哈哈')) // true
    console.log(/^哈+$/.test('二哈很傻')) //  false
    console.log(/^哈+$/.test('哈很傻')) //  false
    console.log(/^哈+$/.test('哈很哈')) // false
    console.log('------------------')
    //  量词 ? 类似  0 || 1
    console.log(/^哈?$/.test('')) // true
    console.log(/^哈?$/.test('哈')) // true
    console.log(/^哈?$/.test('哈哈')) // true
    console.log(/^哈?$/.test('二哈很傻')) //  false
    console.log(/^哈?$/.test('哈很傻')) //  false
    console.log(/^哈?$/.test('哈很哈')) // false
   // 量词 {n} 写几,就必须出现几次
    console.log(/^哈{4}$/.test('哈')) //  false
    console.log(/^哈{4}$/.test('哈哈')) //  false
    console.log(/^哈{4}$/.test('哈哈哈')) //  false
    console.log(/^哈{4}$/.test('哈哈哈哈'))// true
    console.log(/^哈{4}$/.test('哈哈哈哈哈')) //  false
    console.log(/^哈{4}$/.test('哈哈哈哈哈哈')) //  false
    console.log('------------------')
    // 量词 {n,}   >=n
    console.log(/^哈{4,}$/.test('哈'))//  false
    console.log(/^哈{4,}$/.test('哈哈'))//  false
    console.log(/^哈{4,}$/.test('哈哈哈'))//  false
    console.log(/^哈{4,}$/.test('哈哈哈哈'))// true
    console.log(/^哈{4,}$/.test('哈哈哈哈哈'))// true
    console.log(/^哈{4,}$/.test('哈哈哈哈哈哈'))// true
    console.log('------------------')

字符类:

[ ] 匹配字符集合
后面的字符串只要包含 abc 中任意 一个字符 ,都返回 true 。
    // 字符类   [abc]  只选1个
    console.log(/^[abc]$/.test('a'))  // true
    console.log(/^[abc]$/.test('b'))  // true
    console.log(/^[abc]$/.test('c'))  // true
    console.log(/^[abc]$/.test('ab'))  // false
    console.log(/^[abc]{2}$/.test('ab'))  // true

使用连字符 - 表示一个范围

比如:
     [a-z] 表示 a 到 z 26个英文字母都可以
     [a-zA-Z] 表示大小写都可以
     [0-9] 表示 0~9 的数字都可以
认识下:
    // 字符类   [a-z]  只选1个
    console.log(/^[A-Z]$/.test('p'))  // false
    console.log(/^[A-Z]$/.test('P'))  // true
    console.log(/^[0-9]$/.test(2))  // true
    console.log(/^[a-zA-Z0-9]$/.test(2))  // true
    console.log(/^[a-zA-Z0-9]$/.test('p'))  // true
    console.log(/^[a-zA-Z0-9]$/.test('P'))  // true
[ ] 里面加上 ^ 取反符号
比如:
     [^a-z] 匹配除了小写字母以外的字符
     注意要写到中括号里面
. 匹配除换行符之外的任何单个字符

预定义:指的是 某些常见模式的简写方式。

修饰符

修饰符约束正则执行的某些细节行为,如是否区分大小写、是否支持多行匹配等

语法:

  i 是单词 ignore 的缩写,正则匹配时字母不区分大小写
  g 是单词 global 的缩写,匹配所有满足正则表达式的结果

替换 replace

语法:

    const str = 'java是一门编程语言, 学完JAVA工资很高'
    const re = str.replace(/java/ig, '前端')
    console.log(re)  // 前端是一门编程语言, 学完前端工资很高

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【开源项目--稻草】Day04

【开源项目--稻草】Day04 1. 续 VUE1.1 完善VUEAJAX完成注册功能 Spring验证框架什么是Spring验证框架使用Spring-Validation 稻草问答-学生首页显示首页制作首页的流程开发标签列表标签列表显示原理 从业务逻辑层开始编写控制层代码开发问题列表开发业务逻辑层开发页面和JS代码…

Vue系列第八篇:echarts绘制柱状图和折线图

本篇将使用echarts框架进行柱状图和折线图绘制。 目录 1.绘制效果 2.安装echarts 3.前端代码 4.后端代码 1.绘制效果 2.安装echarts // 安装echarts版本4 npm i -D echarts4 3.前端代码 src/api/api.js //业务服务调用接口封装import service from ../service.js //npm …

Go Windows下开发环境配置(图文)

Go Windows下开发环境配置 下载 安装 点击下载的安装包进行安装。安装路径可以选择到自己的目录。 环境变量配置 GOROOT:(指定到安装目录下) GOPATH:(是工作空间) path:在安装时已经添加了…

XML基础知识讲解

文章目录 1. xml简介2. xml快速入门3. xml的元素(标签)定义4. xml标签的命名规范5. xml的属性定义和注释6. 转义字符7. CDATA区8. xml的处理指令9. xml的约束 1. xml简介 XML(eXtensible Markup Language)是一种用于描述数据的标记语。 它以纯文本的方…

并查集练习 — 岛屿问题(解法二)

题目如岛屿问题解法一文章所介绍,这里不过多赘述,直接讲解第二种解法。 并查集解法 并查集解法的整体思路是,将二维数组中为‘1’的部分提取出来作为样本,再进行判断,如果左上方向有同样为‘1’的,则进行…

架构训练营学习笔记:6-1 微服务

序 这部分是了解的。传统企业使用soa较多。很多企业银行、电信对于Oracle 依赖大,强调稳定性。各个项目侧重外包,技术栈不统一。 soa 历史 这个之前电信的BOSS系统就是这种架构,不知道现在呢,核心计费系统billing是运行在tuxduo…

整理mongodb文档:collation

文章连接 整理mongodb文档:collation 看前提示 对于mongodb的collation。个人主要用的范围是在createcollection,以及find的时候用,所以本片介绍的时候也是这两个地方入手,对新手个人觉得理解概念就好。不要求强制性掌握,但是要…

jmeter工具测试和压测websocket协议【杭州多测师_王sir】

一、安装JDK配置好环境变量,安装好jmeter 二、下载WebSocketSampler发送请求用的,地址:https://bitbucket.org/pjtr/jmeter-websocket-samplers/downloads/?spma2c4g.11186623.2.15.363f211bH03KeI 下载解压后的jar包放到D:\JMeter\apache-j…

MyCat配置rule.xml、server.xml讲解

1. rule.xml分片规则配置文件 rule.xml中配置的主要就是拆分表的规则,rule.xml中主要包含两类标签 tableRule 和Function。 tableRule标签里面主要配置我们的分片规则,Function里面涉及的是分片规则里面所涉及的java类,都是在function中配置…

python中的装饰器的真正含义和用法

闭包: 闭包是python中的一个很实用的写法,可以使得用户在函数中调用该函数外的函数的变量,使得该变量常驻于内存中。 闭包函数: 输入是函数,输出也是一个函数。 装饰器的写法是python闭包的语法糖。 面试中经常面…

[C++] KY79 浮点数加法 北京大学复试上机题

题目链接 KY79 浮点数加法https://www.nowcoder.com/questionTerminal/ddec753f446e4ba4944e35378ba635c8 描述 求2个浮点数相加的和 题目中输入输出中出现浮点数都有如下的形式: P1P2...Pi.Q1Q2...Qj 对于整数部分,P1P2...Pi是一个非负整数 对于小数…

【前端】html

HTML标签(上) 目标: -能够说出标签的书写注意规范 -能够写出HTML骨架标签 -能够写出超链接标签 -能够写出图片标签并说出alt和title的区别 -能够说出相对路径的三种形式 目录: HTML语法规范HTML基本结构标签开发工具HTML常用标…

C语言案例 99乘法口诀-04

难度2复杂度2 题目:打印99乘法口诀 步骤一:定义程序目标 编写一个C程序,打印99乘法口诀。 步骤二:程序设计 整个程序分别为两个部分,第一部分是使用for循环打印的行数,第二部分是使用for循环控制打印的列…

基于Azure OpenAI Service 的知识库搭建实验⼿册

1.概要 介绍如何使⽤Azure OpenAI Service 的嵌⼊技术,创建知识库;以及创建必要的资源组和资源,包括 Form Recognizer 资源和 Azure 翻译器资源。在创建问答机器⼈服务时,需要使⽤已部署模型的 Azure OpenAI 资源、已存在的…

一键翻译,实现文件名简体中文转日语的便捷改名!

您是否曾经遇到过想要将文件名从简体中文翻译成日语,却苦于没有合适的工具?现在,让我们为您介绍一款便捷的解决方案——文件名简体中文转日语翻译工具! 首先,第一步,我们需要打开文件批量改名,…

无涯教程-Perl - binmode函数

描述 此函数设置在区分两者的操作系统上以二进制形式读取和写入FILEHANDLE的格式。非二进制文件的CR LF序列在输入时转换为LF,在LF时在输出时转换为CR LF。这对于使用两个字符分隔文本文件中的行的操作系统(MS-DOS)至关重要,但对使用单个字符的操作系统(Unix,Mac OS,QNX)没有影…

付款方式谈得好,订单跑不了

在与客户商讨付款方式时出现分歧,其实是非常常见的情况。 在这种情况下,我们需要紧握谈判的节奏,不可忽视任何细节,更不能让自己陷入混乱之中。 先看一个案例~ 客户发来邮件: Dear... Please find our attached f…

远程访问桌面软件 OpenText Exceed TurboX(ETX)如何提高企业生产力

远程访问桌面软件 OpenText Exceed TurboX(ETX)如何提高企业生产力 几乎所有规模和行业的企业,员工的工作方式、时间和地点方面发生重大变化,这主要得益于新技术和全球商业与协作。业务领导者正在推动其 IT 部门提出解决方案&…

使用yarn启动项目报错

使用yarn启动项目报错 解决方法: 1.点击“开始”菜单搜索找到 Windows PowerShell ISE并以管理员身份运行(注:不是以管理员的身份直接运行cmd) 2. 输入 set-ExecutionPolicy RemoteSigned 回车 3.输入(选择全是) 4.再输入get-Exe…

【Linux】五、进程

一、冯诺依曼体系结构 存储器:指的是内存; 输入设备:键盘、摄像头、话筒,磁盘,网卡; 输出设备:显示器、音响、磁盘、网卡; 中央处理器(CPU):运算器…