【前端】JavaScript 正则

【参考：【正则】工具总结_myaijarvis的博客-CSDN博客】

基础

参考：JavaScript replace 方法
replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。

stringObject.replace(regexp/substr,replacement)

---

参考：JavaScript的正则（RegExp）_小笼包不是包的博客-CSDN博客

参考：正则表达式_小笼包不是包的博客-CSDN博客 写得非常好

特殊字符

特殊字符就是正则表达式里面用到的关键字，而我们又需要匹配的字符里面又有它们，所以就要在其之前加应该\

正则表达式中，需要转义的字符：* . ? + $ ^ [ ] ( ) { } | \ /

比如匹配?，但?是关键字，所以需要 \?

let title = document.title; // "(1条消息) JavaScript的正则xxx"
title = title.replace(/\(.*?\)/, "").trim(); // 去掉CSDN "(1条消息)"  再去掉前后空格

let url = document.URL; // https://blog.csdn.net/xxx/article/details/81980161?id=xxx
let pattern = /\?.*/; // ?是特殊字符，需要加反斜杠
url=url.replace(pattern, ""); // 去掉?后面的参数

// '/'是 "/正则表达式/" 里面的开始和结束符号，所以匹配/也要加\变成\/
// '.'是特殊符号，所以需要\.
// .*? 是尽可能少匹配字符
document.URL.match(/https:\/\/leetcode-cn\.com\/problems\/.*?\/solution/)
// url：https://leetcode-cn.com/problems/top-k-frequent-elements/solution/

// .*? 可以写成 (.*?) 这样更加美观且不易出错

参考：正则表达式 – 语法 | 菜鸟教程

写代码前先到下面网站测试一下 正则表达式 是否正确
正则表达式在线测试-菜鸟教程

转义

let urlPattern = 'ixigua.com/\\d+'; // \d	匹配一个数字字符。等价于 [0-9]。
const reg = new RegExp(urlPattern, "i"); 
let url='https://www.ixigua.com/7225244935484604980/';
console.log(reg.test(url)); // true

// 上述代码可能会匹配到 ixigua1com/7225244935484604980/

在这个示例代码中，我们首先定义了 urlPattern 字符串，该字符串表示了需要匹配的 URL 地址的模式，其中使用了正则表达式的 \d 代表一个数字，并使用了双反斜杠 \ 对其进行转义。

接下来，我们使用 new RegExp() 构建了一个正则表达式对象，传入了 urlPattern 作为模式字符串，以及 “i” 作为标识字符串，表示忽略大小写。

最后，我们使用 test() 方法，将需要匹配的 URL 地址作为参数传入正则表达式中，并输出了匹配的结果。需要注意的是，在使用 new RegExp() 进行字符串转换时，需要对某些字符进行转义，以避免产生歧义，并保证正则表达式的正确性。

如果您使用的 URL 地址中确实包含了 ixigua.com 并且接着一个或多个数字的子字符串，那么以上代码应该能够正确地匹配结果，并输出 true。

疑问：为什么’ixigua.com/\d+'中的小数点不需要手动转义变成 ‘‘ixigua.com/\d+’’

您提到的正则表达式中的小数点是不需要进行转义的，因为小数点在正则表达式中表示的是匹配除换行符外的任意一个字符（即通配符），而不是表示真正的小数点。

在正则表达式中，只有一些特殊字符（如 , ^, $, *, +, ?, |, (, ), [, ], {, }）需要进行转义，以免产生歧义。对于其他字符，包括小数点和大部分其他的标点符号和字母数字字符，通常不需要进行转义。当然，如果您希望使用小数点的字面意义进行匹配，或者如果您的模式字符串可能会出现类似 ‘ixigua1com’ 这样的拼写错误，那么您可以将小数点进行转义，.变成\.。

综上所述，如果您的模式字符串中包含像 ixigua.com 这样的普通字符，一般情况下是不需要进行转义的，除非您希望使用其字面意义进行匹配，或者如果存在拼写错误的可能性。

建议还是手动加上转义

函数

js中字符串支持正则表达式的方法

设一个字符串
var myName = "fangming";
则支持正则表达式的方法有：split(分割),replace(替换),search(查找),match(元素参数的数组)
console.log(myName.split(/N/i));
console.log(myName.replace(/G/i,"a"));
console.log(myName.search(/N/i));
console.log(myName.match(/I/i));

includes() 不支持
includes(‘blog.csdn.net’);

【参考：JavaScript search 方法 | 菜鸟教程】

返回 与指定查找的字符串或者正则表达式相匹配的 String 对象起始位置。

match

【参考：JavaScript match 方法】

返回 存放匹配结果的数组， 如果没找到匹配结果返回 null 。

• 如果 regexp 没有标志 g，那么 match() 方法就只能在 stringObject 中执行一次匹配。它将返回一个数组，其中存放了与它找到的匹配文本有关的信息。如果没有找到任何匹配的文本， match() 将返回 null。
  该数组的第 0 个元素存放的是匹配文本，而其余的元素存放的是与正则表达式的子表达式匹配的文本。除了这些常规的数组元素之外，返回的数组还含有两个对象属性。index 属性声明的是匹配文本的起始字符在 stringObject 中的位置，input 属性声明的是对 stringObject 的引用。
  返回结果数组的第一个元素 arr[0]
  index:找到匹配的字符串的索引编号
  input:匹配的字符串

• 如果有g，则返回 所有匹配结果组成的数组

let str = `前端对于网站来说，通常是指，网站的前台部分包括网站的表现层和结构层。
  因此前端技术一般分为前端设计和web前端开发，前端设计一般可以理解为网站的视觉设计，前端开发则是网站的前台代码实现，
  包括基本的HTML和CSS以及JavaScript ajax，
  现在最新的高级版本HTML5、CSS3，以及SVG等。`;

var arr = str.match(/前端/); //match返回的是一个数组
console.log(arr);
/*
[
  '前端',
  index: 0,
  input: '前端对于网站来说，通常是指，网站的前台部分包括网站的表现层和结构层。\n' +
    '  因此前端技术一般分为前端设计和web前端开发，前端设计一般可以理解为网站的视觉设计，前端开发则是网站的前台代码实现，\n' +
    '  包括基本的HTML和CSS以及JavaScript ajax，\n' +
    '  现在最新的高级版本HTML5、CSS3，以及SVG等。',
  groups: undefined
]
*/

----

// 如果有g，则返回 所有匹配结果组成的数组
var arr2 = str.match(/前端/g); 
console.log(arr2);
// [ '前端', '前端', '前端', '前端', '前端', '前端' ]

let str = `1 plus 2 equal 3`;

var arr = str.match(/\d+/); 
console.log(arr);
// [ '1', index: 0, input: '1 plus 2 equal 3', groups: undefined ]

var arr2 = str.match(/\d+/g); 
console.log(arr2);
// [ '1', '2', '3' ]

let str = "https://www.toutiao.com/w/1753346458361864/";
let res = str.match(/https:\/\/www\.toutiao\.com\/w\/(\d+)/);  // 用括号获取一个组
console.log(res);

res[1] 即为所求数据

如果加g

let str = "https://www.toutiao.com/w/1753346458361864/";
let res = str.match(/https:\/\/www\.toutiao\.com\/w\/(\d+)/g);
console.log(res);
// ['https://www.toutiao.com/w/1753346458361864']