JS(JavaScript) 数据校验 正则表达式

news2024/10/7 11:33:55

天行健,君子以自强不息;地势坤,君子以厚德载物。


每个人都有惰性,但不断学习是好好生活的根本,共勉!


文章均为学习整理笔记,分享记录为主,如有错误请指正,共同学习进步。


乐游原上清秋节,咸阳古道音尘绝。
音尘绝,西风残照,汉家陵阙。
——《忆秦娥·箫声咽》


文章目录

  • JavaScript 数据校验 正则表达式
    • 1. 简介
    • 2. 定义方式
      • 2.1 字面量定义
      • 2.2 构造函数定义
      • 2.3 说明
    • 3. 匹配规则
      • 3.1 元字符
      • 3.2 量词
      • 3.3 特殊符号
    • 4. 基本用法
    • 5. 示例代码
    • 6. 浏览器页面效果
    • 7. 示例代码下载



JavaScript 数据校验 正则表达式

1. 简介

正则表达式是一门独立的语言,有自己的语法,用来检测指定字符串是否符合特定的规则
正则表达式就是用来定义规则的,全称为Regular Expression
JavaScript中提供了RegExp对象,表示正则表达式

2. 定义方式

创建正则表达式对象的方式有两种

2.1 字面量定义

使用字面量定义

var reg = /pattern/attribute;

举例

        var reg = /aaa/i;
        //a是定义的匹配规则,i是忽略大小写
        //通过reg的test函数进行验证
        console.log(reg.test("hahahahahahahab"));

2.2 构造函数定义

使用构造函数定义

var reg = new RegExp(pattern,attribute);

举例

        //定义正则表达式,注意这里的双斜杠中的内容不能以变量传入,只能直接写入
        var reg2 = new RegExp("aaa","i");
        //a是定义的匹配规则,i是忽略大小写
        //通过reg的test函数进行验证
        console.log(reg2.test("hahahahahahahab"));

2.3 说明

pattern 表示匹配模式,用于指定匹配规则,由元字符、量词、特殊符号组成
attribute 表示匹配特征,取值:i忽略大小写、g全局匹配、m多行匹配

3. 匹配规则

3.1 元字符

元字符:具有特殊含义的字符
相关的元字符和对应的含义如下表

符号描述
\s匹配任何的空白字符
\S任何非空白字符
\d匹配一个数字字符,等价于[0-9]
\D除了数字之外的任何字符
\w匹配一个数字、下划线或字母字符
\W除了数字、下划线或字母字符的其他字符,任何非单字字符,等价于
.匹配除了换行符之外的任意字符

3.2 量词

量词:指定字符出现的次数
相关的元字符和对应的含义如下表

符号描述
{n}匹配前一项n次
{n,}匹配前一项n次,或者多次
{n,m}匹配前一项至少n次,但是不能超过m次
*匹配前一项0次或多次,等价于{0,}
+匹配前一项1次或多次,等价于{1,}
?匹配前一项0次或1次,也就是说前一项是可选的,等价于{0,1}

3.3 特殊符号

特殊符号:具有特殊含义的符号
相关的元字符和对应的含义如下表

符号描述
/…/代表一个模式的开始和节数
^匹配字符串的开始,即表示行的开始
$匹配字符串的结束,即表示行的结束
[ ]表示可匹配的列表
()用于分组
|表示或者
[^ ]在[]中的尖括号表示非

注:[\u4E00-\u9FA5]用来匹配中文字符

4. 基本用法

使用正则表达式对象的test方法进行规则是否符合的校验
语法

var flag = reg.test(字符串);

判断字符串是否符合正则表达式对象所制定的模式规则,返回true或false

5. 示例代码

以下为各种规则的实例演示

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>数据校验-正则表达式</title>

    <script>

        //定义正则表达式,注意这里的双斜杠中的内容不能以变量传入,只能直接写入
        var reg = /aaa/i;
        //或
        var reg2 = new RegExp("aaa","i");
        //a是定义的匹配规则,i是忽略大小写
        //通过reg的test函数进行验证
        console.log(reg.test("hahahahahahahab"));
        console.log(reg2.test("hahahahahahahab"));
        console.log("===================================================");
        
        //匹配空白字符
        var regs = new RegExp("\\s","i");
        // 是否包含空白字符
        console.log("匹配空白字符的结果:",regs.test(" "));
        console.log("===================================================");
        
        //匹配非空白字符
        var reg_not_blank = new RegExp("\\S","i");
        // 是否包含非空白字符
        console.log("匹配非空白字符的结果:",reg_not_blank.test("s"));
        console.log("===================================================");
        
        //匹配数字字符[0-9]
        var reg_digital = new RegExp("\\d","i");
        // 是否包含数字字符[0-9]
        console.log("匹配数字字符[0-9]的结果:",reg_digital.test("0"));
        console.log("===================================================");

        //匹配除数字之外的任何字符
        var reg_out_digital = new RegExp("\\D","i");
        // 是否包含除数字之外的任何字符
        console.log("匹配除数字之外的任何字符的结果:",reg_out_digital.test("="));
        console.log("===================================================");

        //匹配一个数字、下划线或字母字符
        var reg_digital_underline_letter = new RegExp("\\w","i");
        // 是否包含一个数字、下划线或字母字符
        console.log("匹配一个数字、下划线或字母字符的结果:",reg_digital_underline_letter.test("_"));
        console.log("===================================================");

        //匹配一个除数字、下划线或字母的其他字符
        var reg_out_digital_underline_letter = new RegExp("\\W","i");
        // 是否包含一个除数字、下划线或字母的其他字符
        console.log("匹配一个除数字、下划线或字母的其他字符的结果:",reg_out_digital_underline_letter.test("="));
        console.log("===================================================");

        //匹配一个除换行符之外的任意字符
        var reg_out_n = new RegExp(".","i");
        // 是否包含一个除换行符之外的任意字符
        console.log("匹配一个除换行符之外的任意字符的结果:",reg_out_n.test("-"));
        console.log("===================================================");

        console.log("==========================数量符=========================");
        
        //匹配前一项字符,并指定匹配的次数
        var reg_n = new RegExp("a{4}","i");
        // 是否包含a字符4次
        console.log("匹配a字符4次的结果:",reg_n.test("saaaasaaaa"));
        console.log("===================================================");

        //匹配前一项字符,并指定匹配的次数
        var reg_n2 = new RegExp("a{4,}","i");
        // 是否包含a字符4次或多次
        console.log("匹配a字符4次或多次的结果:",reg_n2.test("aaaaaaaa"));
        console.log("===================================================");

        //匹配前一项字符,并指定匹配的次数
        var reg_nm = new RegExp("a{4,8}","i");
        // 是否包含a字符4-8次
        console.log("匹配a字符4-8次的结果:",reg_nm.test("aaaaaaaa"));
        console.log("===================================================");

        //匹配前一项字符,并指定匹配的次数
        var reg_0 = new RegExp("a*","i");
        // 是否包含a字符0次或多次
        console.log("匹配a字符0次或多次的结果:",reg_0.test(""));
        console.log("===================================================");

        //匹配前一项字符,并指定匹配的次数
        var reg_1 = new RegExp("a+","i");
        // 是否包含a字符1次或多次
        console.log("匹配a字符1次或多次的结果:",reg_1.test("aa"));
        console.log("===================================================");

        //匹配前一项字符,并指定匹配的次数
        var reg_01 = new RegExp("a?","i");
        // 是否包含a字符0次或1次
        console.log("匹配a字符0次或1次的结果:",reg_01.test(""));
        console.log("===================================================");

        //匹配中文字符
        var reg_cn = new RegExp("[\u4E00-\u9FA5]","i");
        // 是否包含中文字符
        console.log("匹配中文字符的结果:",reg_cn.test("李白"));
        console.log("===================================================");

        //匹配以什么字符开始的字符
        var reg_start = new RegExp("^d","i");
        // 是否以d开头的字符
        console.log("匹配以d开头的字符的结果:",reg_start.test("di"));
        console.log("===================================================");

        //匹配以什么字符结尾的字符
        var reg_end = new RegExp("ss$","i");
        // 是否以d结尾的字符
        console.log("匹配以d结尾的字符的结果:",reg_end.test("ss"));
        console.log("===================================================");

        //匹配匹配列表里的内容,或的关系,表示里表中的任意一个字符被包含即可
        var reg_mid = new RegExp("[aacc]","i");
        // 是否包含列表中的某个字符
        console.log("匹配列表中的某个字符的结果:",reg_mid.test("addd"));
        console.log("===================================================");

        //匹配分组中的字符串
        var reg_mid = new RegExp("(abdc)","i");
        // 是否包含字符串abdc
        console.log("匹配abdc字符串的结果:",reg_mid.test("abdc"));
        console.log("===================================================");

        //匹配任意分组的字符串
        var reg_mid = new RegExp("(abdc)|(aadd)","i");
        // 是否包含任意分组的字符串
        console.log("匹配任意分组的字符串的结果:",reg_mid.test("aadd"));
        console.log("===================================================");

        //匹配非某些字符的其他字符
        var reg_mid = new RegExp("[^0-9]","i");
        // 是否包含0-9之外的字符
        console.log("匹配0-9之外的字符串的结果:",reg_mid.test(" "));
        console.log("===================================================");

        //匹配规则的开始和结束,这里有点问题,布置到怎么应用
        var reg_mid = new RegExp("/libai/","i");
        // 是否包含libai
        console.log("匹配0-9之外的字符串的结果:",reg_mid.test("libai"));
        console.log("===================================================");

    </script>

</head>
<body>
    
</body>
</html>

6. 浏览器页面效果

使用浏览器打开页面控制台,查看校验的输出结果
在这里插入图片描述

7. 示例代码下载

正则表达式相关示例代码已上传CSDN
下载地址:JavaScript 数据校验 正则表达式 示例代码


感谢阅读,祝君暴富!


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

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

相关文章

什么?2024年只要 HTML 和 CSS 就可以实现一个自适应的瀑布流页面了?

瀑布流页面布局&#xff0c;故名思义就是页面上的元素子项像瀑布一样进行上下紧凑布局&#xff0c;一般图片类网站、电商类或者博客类的网站经常会使用这种布局&#xff0c;使得展示的元素比较紧凑和丰富&#xff0c; 类似下图 这里总结一下瀑布流布局主要有以下特征&#xff1…

java生成json格式文件(包含缩进等格式)

生成json文件的同时保留原json格式&#xff0c;拥有良好的格式&#xff08;如缩进等&#xff09;&#xff0c;提供友善阅读支持。 pom.xml依赖增加&#xff1a; <dependency><groupId>com.google.code.gson</groupId><artifactId>gson</artifactI…

物联网综合实验平台-物联网实验实训教学平台-物联网实验箱

物联网&#xff08;IoT&#xff09;是一种连接性技术&#xff0c;将各种设备和物品连接到互联网&#xff0c;通过数据的收集和分析实现更智能的决策和操作。在《“十四五”数字经济发展规划》中&#xff0c;物联网被明确提出&#xff0c;被视为数字经济时代的基础设施。当前&am…

基于循环神经网络的一维信号降噪方法(简单版本,Python)

代码非常简单。 import torch import torch.nn as nn from torch.autograd import Variable from scipy.io.wavfile import write #need install pydub module #pip install pydub import numpy as np import pydub from scipy import signal import IPython import matplot…

NAT地址转换实验,实验超简单

实验拓扑 实验目的 将内网区域&#xff08;灰色区域&#xff09;的地址转换为172.16.1.0 实验过程 配置静态NAT&#xff08;基于接口的静态NAT&#xff09; R1配置 <Huawei>sys Enter system view, return user view with CtrlZ. [Huawei]sysname R1 [R1]un in en I…

LoadRunner-Virtual User Generator组件学习(录制不上内容)

重点知识 LR工具是拿C写的&#xff0c;所以它的脚本默认也是C&#xff0c;但是最终生成的脚本不止是C&#xff0c;它是支持C和Java语言的&#xff0c;这个大家要清楚&#xff0c;对本身懂代码的就很友好&#xff0c;你了解java&#xff0c;那就可以把脚本改成java&#xff0c;…

第十二章 Nest中 Express 和 Fastify

Express是一个用于构建Web应用程序和API的JavaScript框架。它是基于Node.js平台的&#xff0c;并提供了一系列简化了常见Web开发任务的功能&#xff0c;如路由、中间件、模板引擎和数据库集成等。 是一个处理请求、响应的库 其可以通过use一个个中间件来处理请求和返回响应&…

随手记录: Ubuntu NVIDIA显卡驱动安装后 屏幕亮度无法调节 无法连接外显示器等问题

背景 一句话&#xff1a;简单记录帮身边人装系统发现 GPU和外接显示器的无法连接&#xff0c;同时亮度无法调节等新问题 设备型号&#xff1a; 联想笔记本&#xff1a;ThinkBook 16p Gen2CPU&#xff1a;AMD Ryzen 7 5800HGPU&#xff1a;RTX 3060 问题描述及流程&#xff…

深度学习标注文件格式转换

json转xml 原始数据集文件夹中图片格式为bmp&#xff0c;标注文件为json&#xff0c;图片和标注文件放在同一个文件夹下面&#xff0c;将json转为xml格式&#xff0c;图片和标注文件分别存放在一个文件夹下面。 headstr """\ <annotation><folder>…

【CSS in Depth 2 精译】2.4 视口的相对单位

当前内容所在位置 第一章 层叠、优先级与继承第二章 相对单位 2.1 相对单位的威力2.2 em 与 rem2.3 告别像素思维2.4 视口的相对单位 ✔️2.5 无单位的数值与行高2.6 自定义属性2.7 本章小结 2.4 视口的相对单位 前面介绍过的 em 和 rem 是相对于 font-size 定义的&#xff0…

React+TS前台项目实战(二十四)-- 全局常用绘制组件Qrcode封装

文章目录 前言Qrcode组件1. 功能分析2. 代码详细注释3. 使用方式4. 效果展示(pc端 / 移动端) 总结 前言 今天要封装的Qrcode 组件&#xff0c;是通过传入的信息&#xff0c;绘制在二维码上&#xff0c;可用于很多场景&#xff0c;如区块链项目中的区块显示交易地址时就可以用到…

DDOS攻击不懂?看完让你秒懂!

什么是DDOS攻击&#xff1f; DDoS攻击&#xff0c;全称分布式拒绝服务攻击&#xff08;Distributed Denial of Service attack&#xff09;&#xff0c;是一种常见的网络安全攻击方式。以下是对DDoS攻击的详细解释: DDoS攻击是指攻击者利用大量被控制的计算机或设备&#xff…

Appium+python自动化(三十九)-Appium自动化测试框架综合实践 - 代码实现(超详解)

1.简介 今天我们紧接着上一篇继续分享Appium自动化测试框架综合实践 - 代码实现。由于时间的关系&#xff0c;宏哥这里用代码给小伙伴演示两个模块&#xff1a;注册和登录。 2.业务模块封装 因为现在各种APP的层出不群&#xff0c;各式各样的。但是其大多数都有注册、登录。为…

嵌入式Linux之Uboot简介和移植

uboot简介 uboot 的全称是 Universal Boot Loader&#xff0c;uboot 是一个遵循 GPL 协议的开源软件&#xff0c;uboot是一个裸机代码&#xff0c;可以看作是一个裸机综合例程。现在的 uboot 已经支持液晶屏、网络、USB 等高级功能。 也就是说&#xff0c;可以在没有系统的情况…

vue如何实现低代码

Vue.js 本身作为一个前端框架&#xff0c;并不是专门设计用来实现低代码平台的工具。然而&#xff0c;借助 Vue.js 的灵活性和组件化特性&#xff0c;可以在其基础上构建低代码平台或低代码工具。以下是一些实现低代码平台所需的关键功能和技术&#xff0c;可以在 Vue.js 中进行…

使用ChatGPT自动生成测试用例思维导图

使用ChatGPT自动生成测试用例思维导图 引言ChatGPT在测试用例编写中的应用全面覆盖测试场景边界测试避免测试用例重复 借助ChatGPT生成测试用例思维导图准备工作步骤一&#xff1a;与ChatGPT对话步骤二&#xff1a;生成思维导图代码 结语 引言 在编写测试用例时&#xff0c;测…

Openwrt路由器部分ipv6公网地址无法访问的问题

路由器是Openwrt&#xff0c;终端访问ipv6地址经常有些能访问&#xff0c;有些不能访问&#xff0c;一开始以为是运营商问题&#xff0c;后面ssh到openwrt发现所有访问都正常。 查阅资料后才知道是MTU设置问题&#xff0c;Openwrt 默认MTU是1492&#xff0c;使用IPV6应减少60个…

AI智能音箱用2×15W立体声功放芯片NTP8918

智能音箱是近年来非常受欢迎的智能家居产品之一&#xff0c;它集成了人工智能技术和音频技术&#xff0c;能够为用户提供语音助手、音乐播放、智能家居控制等多种功能。其中&#xff0c;音频输出是智能音箱的核心功能之一&#xff0c;而功放芯片则是实现音频放大的关键组成部分…

8-Bit Retro Game SFX Pack(复古游戏音效)

大量高品质、专业制作的8位复古声音。8Bit Retro SFX Pack 1将为您的游戏带来您想要的优势。将跳跃、物品拾取和武器声音添加到经典视觉效果中。伴随着爆炸声、火灾声、通电声和断电声&#xff0c;让人回到怀旧的电子游戏黄金时代。通过包含的数百个音频文件&#xff0c;找到您…

智能视频监控如何助力体育场馆安全管理:安防监控EasyCVR视频综合管理方案

近期有新闻报道&#xff0c;6月30日&#xff0c;17岁的中国国家羽毛球运动员在亚洲青年羽毛球锦标赛中&#xff0c;突然晕倒并抽搐&#xff0c;尽管被送往医院抢救&#xff0c;该运动员仍在当晚不幸离世。运动猝死不仅发生于职业运动员身上&#xff0c;在普通健身者中也时有发生…