17 JavaScript 学习:正则表达式

简介: 17 JavaScript 学习:正则表达式

JavaScript 正则表达式

JavaScript中正则表达式是一种强大的工具,用于在字符串中进行模式匹配和搜索。下面是一些JavaScript中使用正则表达式的基本知识:

  1. 创建正则表达式:可以使用字面量形式或者RegExp构造函数来创建正则表达式。
  • 字面量形式:var regex = /pattern/;
  • 构造函数形式:var regex = new RegExp('pattern');
  1. 匹配模式:在正则表达式中,可以使用各种字符和特殊符号来构建匹配模式,例如:
  • \d:匹配数字字符。
  • \w:匹配字母、数字或下划线字符。
  • []:匹配指定范围内的字符。
  • ^:匹配输入的开始。
  • $:匹配输入的结束。
  • |:逻辑或操作符,匹配多个模式中的任意一个。
  1. 常用方法:JavaScript中常用的正则表达式方法包括:
  • test():测试字符串是否匹配正则表达式,返回true或false。
  • exec():在字符串中执行正则表达式匹配,返回匹配结果的数组或null。
  • match():在字符串中检索匹配的字符串,返回一个包含匹配结果的数组或null。
  • replace():在字符串中执行搜索并替换,返回替换后的新字符串。
  • search():在字符串中搜索匹配项,返回匹配到的第一个字符的索引,若无匹配则返回-1。
  1. 修饰符:在正则表达式中,可以使用修饰符来改变匹配的行为,例如:
  • i:忽略大小写。
  • g:全局匹配,查找所有匹配而非在找到第一个匹配后停止。
  • m:多行匹配模式。
  1. 示例:以下是一些使用正则表达式的示例:
var str = "Hello, world!";
var pattern = /world/;
// 测试字符串是否匹配
console.log(pattern.test(str)); // 输出 true
// 执行正则表达式匹配
console.log(pattern.exec(str)); // 输出 ["world", index: 7, input: "Hello, world!", groups: undefined]
// 检索匹配的字符串
console.log(str.match(pattern)); // 输出 ["world", index: 7, input: "Hello, world!", groups: undefined]
// 替换匹配项
console.log(str.replace(pattern, "universe")); // 输出 "Hello, universe!"
// 搜索匹配项
console.log(str.search(pattern)); // 输出 7

这些是JavaScript中使用正则表达式的基础知识,你可以根据具体需求深入学习和应用正则表达式。

正则表达式语法

正则表达式(Regular Expression)是一种用来描述字符串匹配模式的表达式。它在文本处理、搜索和替换等操作中广泛应用。下面是一些常见的正则表达式语法:

  1. 普通字符:大多数字符(字母、数字、符号)在正则表达式中会按照字面意义匹配。
  2. 特殊字符
  • .: 匹配除换行符以外的任意一个字符。
  • ^: 匹配输入字符串的开始位置。
  • $: 匹配输入字符串的结尾位置。
  • \: 将其后面的特殊字符转义为普通字符,例如\.匹配点本身。
  1. 字符类别
  • [...]: 匹配方括号内列出的任意一个字符,如[abc]匹配字符a、b、c中的任意一个。
  • [^...]: 匹配除方括号内列出的任意一个字符,如[^abc]匹配非a、b、c的任意字符。
  1. 量词
  • *: 匹配前面元素出现0次或多次。
  • +: 匹配前面元素出现1次或多次。
  • ?: 匹配前面元素出现0次或1次。
  • {n}: 匹配前面元素刚好出现n次。
  • {n,}: 匹配前面元素至少出现n次。
  • {n,m}: 匹配前面元素出现n到m次。
  1. 转义字符
  • \d: 匹配数字字符,相当于[0-9]
  • \w: 匹配字母、数字、下划线,相当于[a-zA-Z0-9_]
  • \s: 匹配空白字符,包括空格、制表符、换行符等。
  1. 分组
  • (...): 将括号内的内容作为一个分组,可以对分组使用量词。
  1. 选择
  • |: 表示“或”,用于在多个表达式中选择一个匹配。

这只是正则表达式语法的基础部分,正则表达式功能强大,可以实现复杂的匹配需求。

使用字符串方法

在 JavaScript 中,search 方法和 replace 方法是用于处理字符串的两个常用方法。

  1. search 方法
  • search 方法用于在字符串中搜索指定的子字符串,并返回子字符串的位置(索引)。如果找到了匹配的子字符串,则返回其第一个字符的位置;如果没有找到匹配的子字符串,则返回 -1。
  • search 方法支持正则表达式作为搜索条件。
let str = "Hello world!";
let position = str.search("world"); // 返回 6,因为子字符串 "world" 在原字符串中的位置是从第 6 个字符开始的
  1. replace 方法
  • replace 方法用于在字符串中替换指定的子字符串(或者匹配的正则表达式),并返回替换后的新字符串。
  • 可以使用正则表达式作为替换的匹配条件,并结合正则表达式中的捕获组来进行更复杂的替换操作。
let str = "Visit Microsoft!";
let newStr = str.replace("Microsoft", "Google"); // 返回 "Visit Google!",将 "Microsoft" 替换为 "Google"

结合正则表达式时,replace 方法可以通过正则表达式中的捕获组来实现更灵活的替换:

let str = "apple, banana, orange";
let newStr = str.replace(/(\w+), (\w+), (\w+)/, "$3, $2, $1"); // 返回 "orange, banana, apple",将顺序反转

正则表达式 /(\w+), (\w+), (\w+)/ 匹配了三个以逗号和空格分隔的单词,并将它们分别存储在三个捕获组中。$1$2$3 分别代表第一个、第二个和第三个捕获组,因此将它们按相反的顺序重新排列即可实现顺序反转的效果。

这就是结合正则表达式的 searchreplace 方法在 JavaScript 中的用法。

正则表达式修饰符

正则表达式中的修饰符是指在正则表达式之后添加的字符,用于指定匹配规则的一些特性。常见的正则表达式修饰符包括:

  1. i(不区分大小写):当使用 i 修饰符时,表示匹配时不区分大小写。例如,/hello/i 匹配 “hello”、“Hello”、“HELLO” 等。
  2. g(全局匹配):当使用 g 修饰符时,表示匹配全部字符串而不仅仅是第一个匹配项。例如,/hello/g 匹配 “hello hello hello” 中的所有 “hello”。
  3. m(多行匹配):当使用 m 修饰符时,表示将查找换行符(\n)或者回车符(\r)作为字符串的开始或结束。这主要用于多行文本的匹配。

这些修饰符可以单独使用,也可以组合在一起使用。在 JavaScript 的正则表达式中,修饰符通常直接跟在正则表达式的后面,例如 /pattern/ig

举个例子,如果你想要在一个字符串中查找所有的 “apple”,不区分大小写,可以使用 /apple/ig 正则表达式。其中,i 修饰符表示不区分大小写,g 修饰符表示全局匹配。

这就是正则表达式修饰符在 JavaScript 中的作用和用法。

正则表达式模式

正则表达式模式指的是正则表达式中用于匹配文本的部分,也就是描述要匹配的规则和模式的部分。正则表达式模式由普通字符(例如字母、数字、符号等)和元字符(具有特殊含义的字符)组成,通过这些字符的组合,可以定义出各种复杂的匹配规则。

下面是一些常见的正则表达式模式中的元字符:

  1. .(点):匹配任意单个字符,除了换行符。
  2. \d:匹配一个数字字符,相当于 [0-9]
  3. \w:匹配一个单词字符,包括字母、数字、下划线,相当于 [A-Za-z0-9_]
  4. \b:匹配单词的边界,不匹配任何字符。
  5. ^:匹配输入的开始位置。
  6. $:匹配输入的结束位置。
  7. [ ]:匹配方括号中的任意一个字符。
  8. |:表示逻辑“或”,匹配两者之一。
  9. ():表示捕获分组,可以将其中的内容作为一个整体进行匹配和操作。

使用这些元字符的组合,可以构建出各种复杂的匹配规则,从简单的匹配数字、字母,到复杂的匹配邮箱地址、URL等。正则表达式模式的应用非常广泛,在文本处理、数据提取等方面发挥着重要作用。

使用 RegExp 对象

使用 RegExp 对象是在 JavaScript 中处理正则表达式的一种方式。通过 RegExp 对象,可以创建一个正则表达式的实例,然后用该实例进行匹配、替换等操作。

以下是使用 RegExp 对象的一些常见方法和示例:

  1. 创建 RegExp 对象:可以使用字面量表示法或者构造函数来创建RegExp对象。
  • 字面量表示法:var pattern = /abc/;
  • 构造函数:var pattern = new RegExp("abc");
  1. 测试字符串是否匹配:可以使用 test() 方法来测试一个字符串是否匹配指定的正则表达式。
var pattern = /hello/;
var str = "hello world";
var isMatch = pattern.test(str);
console.log(isMatch); // 输出 true
  1. 匹配字符串:使用 exec() 方法来执行一个正则表达式匹配,返回匹配结果数组或者 null。
var pattern = /hello/;
var str = "hello world";
var result = pattern.exec(str);
console.log(result[0]); // 输出匹配到的字符串 "hello"
  1. 替换字符串:使用 replace() 方法可以将匹配到的部分替换成指定内容。
var pattern = /world/;
var str = "hello world";
var newStr = str.replace(pattern, "JavaScript");
console.log(newStr); // 输出 "hello JavaScript"
  1. 获取匹配位置:使用 search() 方法返回第一个匹配的索引位置。
var pattern = /world/;
var str = "hello world";
var index = str.search(pattern);
console.log(index); // 输出 6

通过 RegExp 对象,我们可以方便地操作正则表达式,对文本进行模式匹配和处理。如果您有更多关于 RegExp 对象的问题或者需要进一步的示例,请随时告诸我。我会尽力帮助您。

关注我,不迷路,共学习,同进步

关注我,不迷路,共学习,同进步

相关文章
|
1月前
|
Web App开发 JavaScript 前端开发
如何学习JavaScript?
如何学习JavaScript?
39 5
|
2月前
|
JavaScript 前端开发 开发者
VUE 开发——Node.js学习(一)
VUE 开发——Node.js学习(一)
84 3
|
1月前
|
JavaScript 前端开发 索引
JavaScript学习第二章--字符串
本文介绍了JavaScript中的字符串处理,包括普通字符串和模板字符串的使用方法及常见字符串操作方法如`charAt`、`concat`、`endsWith`等,适合前端学习者参考。作者是一位热爱前端技术的大一学生,专注于分享实用的编程技巧。
24 2
|
1月前
|
存储 JavaScript 前端开发
JavaScript学习第一章
本文档介绍了JavaScript的基础知识,包括其在网页中的作用、如何通过JavaScript动态设置HTML元素的CSS属性,以及JavaScript中的变量类型(`var`、`let`、`const`)和数据类型(基本数据类型与引用数据类型)。通过实例代码详细解释了JavaScript的核心概念,适合初学者入门学习。
50 1
|
2月前
|
JavaScript
js学习--制作猜数字
js学习--制作猜数字
42 4
js学习--制作猜数字
|
2月前
|
JavaScript
webpack学习五:webpack的配置文件webpack.config.js分离,分离成开发环境配置文件和生产环境配置文件
这篇文章介绍了如何将webpack的配置文件分离成开发环境和生产环境的配置文件,以提高打包效率。
52 1
webpack学习五:webpack的配置文件webpack.config.js分离,分离成开发环境配置文件和生产环境配置文件
|
3月前
|
算法 JavaScript 前端开发
第一个算法项目 | JS实现并查集迷宫算法Demo学习
本文是关于使用JavaScript实现并查集迷宫算法的中国象棋demo的学习记录,包括项目运行方法、知识点梳理、代码赏析以及相关CSS样式表文件的介绍。
第一个算法项目 | JS实现并查集迷宫算法Demo学习
|
2月前
|
JavaScript
js学习--制作选项卡
js学习--制作选项卡
38 4
|
2月前
|
JavaScript
js学习--商品列表商品详情
js学习--商品列表商品详情
25 2
|
2月前
|
JavaScript
js学习--九宫格抽奖
js学习--九宫格抽奖
20 2