当前位置:首页 > 技术分析 > 正文内容

正则表达式,这篇看完就够了

正则表达式是一种用于匹配文本模式的工具,它能够帮助我们在处理文本时更加高效地进行搜索、替换和验证操作。在本篇文章中,我将通过通俗易懂的语言让正则表达式不再苦涩难懂。

基本规则

在正则表达式中,除了基本的字符匹配规则、字符类和量词外,还有一些特殊的符号和元字符,它们在正则表达式中具有特殊的含义和作用。以下是一些常见的正则表达式符号和元字符的说明:

  • /:正则表达式的开始和结束符号。
  • ^:表示匹配文本的开头。例如,/^abc/ 表示匹配以 "abc" 开头的文本。
  • $:表示匹配文本的结尾。例如,/abc$/ 表示匹配以 "abc" 结尾的文本。
  • .:匹配任意单个字符,不包括换行符。例如,/a.c/ 表示匹配以 "a" 开头,"c" 结尾,中间有任意一个字符的文本。
  • |:表示或,可以用于匹配多个表达式中的任意一个。例如,/abc|def/ 表示匹配 "abc" 或 "def"。
  • []:表示字符集,用于匹配一组字符中的任意一个。例如,/[abc]/ 表示匹配字母 "a"、"b" 或 "c" 中的任意一个。
  • ():表示分组,可以将一部分正则表达式放在括号中,并对它们进行分组匹配。例如,/(ab)+/ 表示匹配一或多个 "ab"。
  • ?:表示可选,用于匹配前面的字符或表达式出现零次或一次。例如,/a?b/ 表示匹配零个或一个 "a",后面紧跟一个 "b"。
  • *:表示零个或多个,用于匹配前面的字符或表达式出现零次或多次。例如,/ab*c/ 表示匹配一个 "a",后面跟着零个或多个 "b",最后紧跟一个 "c"。
  • +:表示一或多个,用于匹配前面的字符或表达式出现一次或多次。例如,/ab+c/ 表示匹配一个 "a",后面跟着一个或多个 "b",最后紧跟一个 "c"。
  • {}:表示重复次数,用于指定前面的字符或表达式重复出现的次数范围。例如,/ab{2,4}c/ 表示匹配一个 "a",后面跟着两到四个 "b",最后紧跟一个 "c"。
  • \:表示转义字符,用于将特殊字符转义为普通字符。例如,/a\./ 表示匹配一个 "a",后面跟着一个 "."。

以上是一些常见的正则表达式符号和元字符的说明,还有一些比较重要的符号和元字符:

  • [] 中的 ^:表示不在字符集中,用于匹配不属于指定字符集中的任意字符。例如,/[^abc]/ 表示匹配除了 "a"、"b"、"c" 之外的任意字符。
  • [] 中的 -:表示字符范围,用于匹配指定范围内的任意字符。例如,/[a-z]/ 表示匹配任意小写字母。
  • () 中的 |:表示分组中的或,可以用于匹配分组中的任意一个表达式。例如,/(ab|cd)/ 表示匹配 "ab" 或 "cd"。

API

在JavaScript中,可以使用RegExp对象来创建正则表达式。以下是RegExp对象的一些常用方法:

  • test()

用于测试一个字符串是否匹配正则表达式。该方法返回一个布尔值,表示是否匹配成功。

var regex = /^[a-z]+$/; // 匹配小写字母
var str1 = "hello";
var str2 = "Hello";
console.log(regex.test(str1)); // true
console.log(regex.test(str2)); // fals
  • exec()

exec() 方法用于在一个字符串中查找匹配的文本,并返回第一个匹配的结果。如果没有找到匹配的文本,则返回 null。

该方法返回一个数组,数组的第一个元素是匹配的文本,后面的元素是捕获分组的匹配结果。如果没有捕获分组,则数组的长度为 1。

var regex = /(\d{4})-(\d{2})-(\d{2})/; // 匹配日期格式(yyyy-mm-dd)
var str = "Today is 2023-02-19";
var result = regex.exec(str);
console.log(result); // ["2023-02-19", "2023", "02", "19"]
  • match()

match() 方法用于在一个字符串中查找匹配的文本,并返回所有匹配的结果。该方法返回一个数组,数组中的每个元素都是匹配的文本,数组的长度就是匹配次数。

如果正则表达式中有捕获分组,则返回的数组中每个元素也会包括捕获分组的匹配结果。

var regex = /cat/g; // 匹配所有的 "cat"
var str = "The cat in the hat sat on the mat.";
var result = str.match(regex);
console.log(result); // ["cat", "cat", "cat"]
  • replace()

用于在一个字符串中替换匹配的文本。该方法接受两个参数,第一个参数是要替换的文本或正则表达式,第二个参数是用于替换的新文本或函数。

如果第一个参数是正则表达式,则可以在替换文本中使用 $1、$2 等语法来引用捕获分组的匹配结果。

var regex = /world/g;
var str = "hello world";
var newStr = str.replace(regex, "JavaScript");
console.log(newStr); // "hello JavaScript"

var regex2 = /(\d{4})-(\d{2})-(\d{2})/;
var str2 = "Today is 2023-02-19";
var newStr2 = str2.replace(regex2, "$2/$3/$1");
console.log(newStr2); // "Today is 02/19/2023"

练习题

// 匹配以 "a" 开头,"b" 结尾的字符串
var regex1 = /^a.*b$/;

// 匹配以 "abc" 或 "def" 开头的字符串
var regex2 = /^(abc|def).*/;

// 匹配以 "a" 开头,后面跟着一个或多个 "b",最后紧跟一个 "c" 的字符串
var regex3 = /^ab+c$/;

// 匹配任意一个小写字母或数字的字符串
var regex4 = /^[a-z0-9]+$/;

// 匹配以 "http://" 或 "https://" 开头的 URL
var regex5 = /^(http|https)://.*/;

// 匹配日期格式(yyyy-mm-dd)
var regex6 = /^\d{4}-\d{2}-\d{2}$/;

// 匹配电话号码(格式为:xxx-xxxxxxx 或 xxxxxxxxxxx)
var regex7 = /^\d{3}-?\d{7}$|^\d{10}$/;

// 匹配邮箱地址
var regex8 = /^\w+([-+.]\w+)@\w+([-.]\w+).\w+([-.]\w+)*$/;

// 使用正则表达式进行字符串替换
var str = "hello world";
var newStr = str.replace(/world/, "JavaScript");

console.log(newStr); // "hello JavaScript"

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/4582.html

标签: 正则 ?=
分享给朋友:

“正则表达式,这篇看完就够了” 的相关文章

Lindroid开源应用:在安卓手机 / 平板上安装 Linux发行版

IT之家 6 月 19 日消息,Erfan Abdi 本月发布了 Lindroid 开源应用程序,让用户可以在安卓手机上安装 GNU / Linux 发行版,在完全支持手机硬件的情况下可以运行 Linux 应用程序。Lindroid 开源应用程序就是将 Linux 放入容器中,使用 Halium 等...

总结了Vue3的七种组件通信方式,别再说不会组件通信了

写在前面本篇文章是全部采用的<script setup>这种组合式API写法,相对于选项式来说,组合式API这种写法更加自由,具体可以参考Vue文档对两种方式的描述。本篇文章将介绍如下七种组件通信方式:propsemitv-modelrefsprovide/injecteventBusv...

vue组件间的九种通信方式

前言Vue组件实例间的作用域是相互独立的,而通常一个页面是由很多个组件构成,这些组件可能又嵌套了组件,形成了一个关系网图,它们的关系可能是像下图中一样,大致分为两种使用场景,父子组件间通信和非父子组件间通信,父子组件间通信又分为直接父子关系和间接父子关系。vue提供了多种通信方法,针对不同的通信需求...

Gitlab之间进行同步备份

目前,我们公司有两个研发团队,分别在北京和武汉,考虑到访问速度的问题,原有武汉的研发环境在近端部署。也就是北京和武汉分别有两套独立的研发管理环境,虽然这解决了近端访问速度的问题,但是管理上较为分散,比如研发环境备份和恢复就是最重要的问题之一。最近,处于对安全性和合规性的考虑,希望将北京和武汉的源代码...

学前端,这30个CSS选择器,你必须熟记

你学会了基本的id,class类选择器和descendant后代选择器,然后就觉得完事了吗?如果这样,你就会错过许多灵活运用CSS的机会。虽然本文提到的许多选择器都属于CSS3,并且只能在现代的浏览器中使用,但学会这些是大有好处的。什么是CSS选择器呢?每一条css样式定义由两部分组成,形式如下:[...

JS数组过滤元素的方法

引言JavaScript 作为前端开发的核心技术之一,在现代 Web 开发中扮演着举足轻重的角色。随着 Web 应用越来越复杂,高效处理数据集合的需求日益凸显。本文旨在介绍 JavaScript 中数组过滤的基础知识及其在实际项目中的应用技巧。技术概述定义数组过滤是 JavaScript 提供的一种...