资讯专栏INFORMATION COLUMN

随手查阅的正则匹配笔记

Riddler / 490人阅读

摘要:可视化查看正则表达式复杂版,很直观,神器一枚可视化查看正则表达式简化版

常见需求如下:

如果你只需要获取字符串中的首个匹配项

var re = /quicks(brown).+?(jumps)/ig;
var result = re.exec("The Quick Brown Fox Jumps Over The Lazy Dog");
// 就算有 g 标识,通过 exec 也只能获取到首个匹配项
// result[0]: Quick Brown Fox Jumps

使用了 g 标识时(不使用时以下方法也适用),如果你想获取正则中的组匹配(capture groups)信息

var re = /quicks(brown).+?(jumps)/ig;
var result = re.exec("The Quick Brown Fox Jumps Over The Lazy Dog");
// index 1~n 就是组匹配到的结果(此处正则中有两个括号,则 n 为 2)
// result[1]: Brown
// result[2]: Jumps

关于 exec 的更多详细说明可以查看 MDN 文档 RegExp.prototype.exec()

不使用 g 标识时,如果你想获取正则中的组匹配(capture groups)信息

"mockid=272;其他说明文字……".match(/mockid=(d+);/i)
// ["mockid=272;", "272", index: 0, input: "mockid=272;其他说明文字……"]
// 如果加上 g 标识,就只能得到 ["mockid=272;"]

匹配多种可能出现的值,获取最终匹配到的值

"GET/path/to/some/place".match(/^(GET|POST|PUT|DELETE)/gi)
// 输出:["GET"]

关于 match 的更多详细说明可以查看 MDN 文档 String.prototype.match()

只想知道是否匹配某个正则(true or false)

// RegExp.prototype.test()
var str = "hello world!";
var result = /^hello/.test(str);
console.log(result); // true

关于 test 的更多详细说明可以查看 MDN 文档 RegExp.prototype.test()

// String.prototype.search()
var str = "hey JudE";
var re = /[A-Z]/g;
var re2 = /[.]/g;
console.log(str.search(re)); // returns 4, which is the index of the first capital letter "J"
console.log(str.search(re2)); // returns -1 cannot find "." dot punctuation
// 因此可以直接判断返回负值时匹配结果为 false

关于 search 的更多详细说明可以查看 MDN 文档 String.prototype.search()

对匹配成功的字符串进行处理

function replacer(match, p1, p2, p3, offset, string) {
  // p1:([^d]*) p2:(d*) p3:([^w]*)
  // p1 非数字, p2 数字, p3 非文字
  return [p1, p2, p3].join(" - ");
}
var newString = "abc12345#$*%".replace(/([^d]*)(d*)([^w]*)/, replacer);
console.log(newString);  // abc - 12345 - #$*%
推荐正则工具:

RegExr

非常好用的一个正则编写工具,我会点开左侧菜单栏里的 cheatsheet 来学习编写符合我需求的正则表达式。

Debuggex

可视化查看正则表达式(复杂版),很直观,神器一枚

Regexper

可视化查看正则表达式(简化版)

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/93214.html

相关文章

  • 关于正则表达式一些笔记整理

    摘要:于是对应着,对应着输出月日年九前瞻正则表达式从文本头部想稳步开始解析,文本尾部方向,称为前。只是条件不参与匹配找英文数字下划线而且后面跟着数字的。 基础知识 一 元字符  单词边界 d 数字 [0-9] w 英文 数字 下划线 [a-z0-9_] s 空白字符[ v f] 水平制表符,v垂直制表符, 换行符, 回车符,f换页符 反义 B 非单词边界 D [^0-9] W [^...

    fancyLuo 评论0 收藏0
  • 关于正则表达式一些笔记整理

    摘要:于是对应着,对应着输出月日年九前瞻正则表达式从文本头部想稳步开始解析,文本尾部方向,称为前。只是条件不参与匹配找英文数字下划线而且后面跟着数字的。 基础知识 一 元字符  单词边界 d 数字 [0-9] w 英文 数字 下划线 [a-z0-9_] s 空白字符[ v f] 水平制表符,v垂直制表符, 换行符, 回车符,f换页符 反义 B 非单词边界 D [^0-9] W [^...

    dailybird 评论0 收藏0
  • 关于正则表达式一些笔记整理

    摘要:于是对应着,对应着输出月日年九前瞻正则表达式从文本头部想稳步开始解析,文本尾部方向,称为前。只是条件不参与匹配找英文数字下划线而且后面跟着数字的。 基础知识 一 元字符  单词边界 d 数字 [0-9] w 英文 数字 下划线 [a-z0-9_] s 空白字符[ v f] 水平制表符,v垂直制表符, 换行符, 回车符,f换页符 反义 B 非单词边界 D [^0-9] W [^...

    seanlook 评论0 收藏0
  • 正则表达式

    摘要:本文内容共正则表达式火拼系列正则表达式回溯法原理学习正则表达式,是需要懂点儿匹配原理的。正则表达式迷你书问世了让帮你生成和解析参数字符串最全正则表达式总结验证号手机号中文邮编身份证地址等是正则表达式的缩写,作用是对字符串执行模式匹配。 JS 的正则表达式 正则表达式 一种几乎可以在所有的程序设计语言里和所有的计算机平台上使用的文字处理工具。它可以用来查找特定的信息(搜索),也可以用来查...

    bang590 评论0 收藏0
  • 正则表达式

    摘要:最全正则表达式总结验证号手机号中文邮编身份证地址等是正则表达式的缩写,作用是对字符串执行模式匹配。学习目标了解正则表达式语法在中使用正则表达式在中使 JS高级技巧 本篇是看的《JS高级程序设计》第23章《高级技巧》做的读书分享。本篇按照书里的思路根据自己的理解和经验,进行扩展延伸,同时指出书里的一些问题。将会讨论安全的类型检测、惰性载入函数、冻结对象、定时器等话题。1. 安全的类型检测...

    yibinnn 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<