尧图网络 高端网站定制 · 原创设计
免费咨询热线
400-888-6620
免费获取方案
正则表达式量词完全指南:`+`、`*`、`?` 与 `{n}` 的匹配次数控制(zh.javascript.info)
文档教程前端【免费下载链接】zh.javascript.info现代 JavaScript 教程The Modern JavaScript Tutorial以最新的 ECMAScript 规范为基准通过简单但足够详细的内容为你讲解从基础到高阶的 JavaScript 相关知识。项目地址https://gitcode.com/gh_mirrors/zh/zh.javascript.info点击查看免费下载导读本文围绕现代 JavaScript 教程仓库中的「量词」章节系统讲解正则表达式中控制匹配次数的核心语法精确数量{n}、范围{n,m}以及常用缩写、*、?。你将学会用量词把零散的字符类组装成能匹配电话号码、小数、HTML 标签、颜色值等真实文本的模式并通过仓库内配套的实战任务与相邻章节字符类、词边界、贪婪/惰性量词掌握量词在不同场景下的行为与取舍。读完本文你不仅能写出/\d{1,}/g、/colou?r/g这类常见表达式还能理解更精确的正则往往更复杂这一设计准则。量词解决了什么问题假设我们拿到一个字符串7(903)-123-45-67想从中提取出所有完整的数字7, 903, 123, 45, 67。如果只用单个字符类\d配合g修饰符得到的是一个个孤立的数字字符而不是完整的数let str 7(903)-123-45-67; alert(str.match(/\d/g)); // 7,9,0,3,1,2,3,4,5,6,7问题在于一个数是一个或多个数字的连续序列。要表达出现多少次就需要在字符或字符类、[...]集合后面附加一个量词quantifier。这正是本仓库 09-regexp-quantifiers/article.md 一章的主题也是后续正则实战的基础模块。精确数量{n}与{n,m}确切位数{5}最简单的量词是写在花括号里的数字{n}它表示前面那个字符或字符类恰好出现 n 次。alert(Im 12345 years old.match(/\d{5}/)); // 12345\d{5}与手写五个\d\d\d\d\d完全等价。如果要排除位数更多的数字比如123456中的前五位可以借助词边界\b写成\b\d{5}\b只匹配独立成词的 5 位数。范围{3,5}与省略上限的{3,}在花括号中写入下限和上限即可表达范围alert(Im not 12, but 1234 years old.match(/\d{3,5}/)); // 1234\d{3,5}匹配 3 到 5 位数字\d{3,}省略上限表示至少 3 位本例匹配345678对照{3,5}可以发现12只有两位所以不匹配1234恰好落在范围内。回到电话示例用\d{1,}表达一个及以上数字即可一次性取出全部数字let str 7(903)-123-45-67; let numbers str.match(/\d{1,}/g); alert(numbers); // 7,903,123,45,67量词还可以作用在字符类之外的字符或集合上例如\.{3,}表示连续 3 个及以上点号这在仓库配套任务 1-find-text-manydots/task.md 中被用于查找省略号连续 3 个或更多.。注意点号.是特殊字符必须转义为\.其标准解法参见 1-find-text-manydots/solution.mdlet regexp /\.{3,}/g; alert(Hello!... How goes?......match(regexp)); // ..., .....三种常用缩写、?、*日常使用中几个高频量词有专门缩写与{n}形式完全等价缩写含义等价写法典型示例一个或多个{1,}\d匹配所有连续数字?零个或一个可选{0,1}ou?r同时匹配or与our*零个及以上{0,}\d0*匹配数字后跟任意数量含零个的0一个或多个\d等价于\d{1,}直接从电话号码字符串中取出全部数字let str 7(903)-123-45-67; alert(str.match(/\d/g)); // 7,903,123,45,67?零个或一个使符号可选?让前面的字符可有可无。模式ou?r表示匹配o后跟零个或一个u再跟r。于是colou?r能同时匹配美式拼写与英式拼写let str Should I write color or colour?; alert(str.match(/colou?r/g)); // color, colour*零个及以上\d0*匹配一个数字后面跟着任意数量的零可能很多也可能一个都没有alert(100 10 1.match(/\d0*/g)); // 100, 10, 1与对比更能看出差异\d0要求至少有一个零因此1不会被匹配出来alert(100 10 1.match(/\d0/g)); // 100, 101 被排除量词实战从数字到 HTML 标签量词是构造复杂正则的主要积木。仓库章节 09-regexp-quantifiers/article.md 提供了三个递进示例展示量词与字符类、转义、可选符号的组合能力。小数的正则表达式\d\.\d带浮点的小数由整数部分 点 小数部分组成于是写成\d\.\d点号需转义alert(0 1 12.345 7890.match(/\d\.\d/g)); // 12.345整数和小数部分都要求至少一位数字所以0、1、7890均被排除只有12.345命中。无特性的开放 HTML 标签从[a-z]到[a-z][a-z0-9]*第一步最简单的写法是/[a-z]/i字符后跟一个或多个拉丁字母再跟alert(body ... /body.match(/[a-z]/gi)); // body但根据 HTML 标准标签名从第二个字符起可以出现数字例如h1[a-z]无法覆盖这种情况。因此进阶版用[a-z][a-z0-9]*首字符必须是字母后续可以是字母或数字且数量为零个或多个alert(h1Hi!/h1.match(/[a-z][a-z0-9]*/gi)); // h1这里*的零个及以上语义正是关键——单字母标签名如p在[a-z]之后可以没有更多字符。同时匹配开标签与闭标签/\/?[a-z][a-z0-9]*/i在模式开头加入可选的斜杠/即可让同一个正则同时匹配h1与/h1alert(h1Hi!/h1.match(/\/?[a-z][a-z0-9]*/gi)); // h1, /h1注意斜杠必须写成\/在 JavaScript 的字面量正则pattern:/.../中未转义的/会被引擎当作模式的结束符。关于特殊字符转义的完整规则可参考仓库的 07-regexp-escaping/article.md其中同样说明了使用new RegExp(...)构造时不必转义斜杠。精确与复杂之间的权衡从上述例子能总结出一条通用规律原文档以 smart 提示框给出正则表达式越精确往往就越长越复杂。例如 HTML 标签可以偷懒写成\w但由于 HTML 对标签名的限制更严格首字符必须是字母[a-z][a-z0-9]*更可靠。实际开发中两种变体都可接受具体取舍取决于你对额外误匹配的容忍度以及事后用其他手段剔除误匹配的难易程度。量词与词边界配合匹配 HTML 颜色值仓库配套任务 2-find-html-colors-6hex/task.md 要求匹配#ABCDEF形式的颜色值#后紧跟六位十六进制字符。利用字符类[a-f0-9]配合精确量词{6}与i修饰符可得到/#[a-f0-9]{6}/gilet regexp /#[a-f0-9]{6}/gi; let str color:#121212; background-color:#AA00ef bad-colors:f#fddee #fd2; alert(str.match(regexp)); // #121212,#AA00ef但该解法存在一个边界问题它会从更长的序列#12345678中切出前六位#123456。标准解法见 2-find-html-colors-6hex/solution.md是在末尾追加词边界\b确保颜色值后面紧邻的不是单词字符// 合法颜色值 alert(#123456.match(/#[a-f0-9]{6}\b/gi)); // #123456 // 不是颜色值后面还跟着数字 alert(#12345678.match(/#[a-f0-9]{6}\b/gi)); // null\b是一种零宽检查它在字符串开头首字符为单词字符时、单词字符与非单词字符之间、以及字符串末尾末字符为单词字符时成立。注意\w只包含拉丁字母、数字与下划线因此\b对西里尔字母、中文等非拉丁文本并不适用——详见仓库 06-regexp-boundary/article.md。\d、\w、\s等字符类及其大写反向类\D、\W、\S的定义见 02-regexp-character-classes/article.md。量词的两种工作模式贪婪与惰性量词还有一层容易被忽略的关键语义默认贪婪情况下量词会尽可能多地匹配字符。例如/\d/会吃掉所有连续数字用/./去匹配a witch and her broom is one得到的不是两个引号片段而是从第一个引号一直吞到最后一个引号的witch and her broom。仓库在 10-regexp-greedy-and-lazy/article.md 中用女巫与扫帚的例子完整演示了引擎的贪婪搜索与回溯过程点.一路匹配到字符串末尾发现剩余模式引号无法匹配后再逐步吐出字符回溯直到找到可行的结束位置。在量词后追加一个?即可切换为惰性模式如*?、?、??表示重复尽可能少的次数let regexp /.?/g; let str a witch and her broom is one; alert(str.match(regexp)); // witch, broom这里问号?的双重身份值得注意单独使用时它是零或一个的量词而跟在另一个量词甚至它自己??后面时它把匹配模式从贪婪切换为惰性。惰性并非万能药——文中还演示了/a href.*? classdoc/g在处理...a hreflink1 classwrong... p style classdoc...时仍会错误跨标签匹配最终的正确方案是改用排除字符集href[^]*用非引号集合精确限定取值范围。这再次印证了同一原则写出精确的正则往往需要组合量词、字符类与边界检查而不是一味依赖某种单一技巧。总结量词是正则表达式的核心乘法表本文覆盖了仓库 09-regexp-quantifiers 章节的全部要点精确数量{n}恰好 n 次、{n,m}n 到 m 次、{n,}至少 n 次缩写一个及以上{1,}、?零或一个{0,1}、*零个及以上{0,}组合实战\d\.\d匹配小数、[a-z][a-z0-9]*匹配 HTML 标签、\/?...同时匹配开闭标签、#[a-f0-9]{6}\b匹配颜色值配套任务验证\.{3,}查找省略号、#[a-f0-9]{6}\b精确匹配六位颜色值两个任务的题目与标准解分别位于 1-find-text-manydots 与 2-find-html-colors-6hex 目录深层语义默认贪婪、加?变惰性精确性往往以表达式复杂度为代价。掌握量词之后建议继续阅读仓库的 10-regexp-greedy-and-lazy/article.md 理解回溯行为并结合 11-regexp-groups/article.md 等后续章节把量词与分组、捕获结合使用构建完整的实战正则能力。赞分享文档教程前端【免费下载链接】zh.javascript.info现代 JavaScript 教程The Modern JavaScript Tutorial以最新的 ECMAScript 规范为基准通过简单但足够详细的内容为你讲解从基础到高阶的 JavaScript 相关知识。项目地址https://gitcode.com/gh_mirrors/zh/zh.javascript.info点击查看免费下载相关推荐JavaScript 正则量词完全指南、*、? 与 {n} 实现精确匹配JavaScript 正则量词完全指南、 、? 与 {n} 实现精确匹配 正则表达式中的量词quantifier是构建复杂匹配模式的核心积木它们决文档/教程前端JavaScript 正则表达式中的量词详解, *, ? 和 {n}JavaScript 正则表达式中的量词详解, , ? 和 {n} 引言 在 JavaScript 正则表达式中量词 quantifiers 是极其重要的文档教程前端JavaScript 正则表达式教程量词 , *, ? 和 {n} 的深入解析JavaScript 正则表达式教程量词 , , ? 和 {n} 的深入解析 引言 在 JavaScript 正则表达式中量词 quantifiers 是上一篇Open Design 设计系统实践还原 Duolingo 游戏化视觉语言的完整指南下一篇三月七小助手星穹铁道自动化工具如何帮你每天节省30分钟游戏时间创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
RELATED

相关推荐

智能家居B端交付系统的三大架构瓶颈与轻量化破局方案

智能家居B端交付系统的三大架构瓶颈与轻量化破局方案

摘要:本文基于11年智能家居供应链与全链路交付的一线经验,从系统架构视角拆解B端从业者面临的三个结构性瓶颈——产品利润层被双向挤压、交付服务层容错率为零、售后运维层隐性成本反噬。针对每个瓶颈提出可落地的轻量化方案:产品组合解耦与信…

📅 2026/10/9 1:27:10
题解:洛谷 P8901 [USACO22DEC] Circular Barn S(废)

题解:洛谷 P8901 [USACO22DEC] Circular Barn S(废)

本文分享的必刷题目是从蓝桥云课、洛谷、AcWing等知名刷题平台精心挑选而来,并结合各平台提供的算法标签和难度等级进行了系统分类。题目涵盖了从基础到进阶的多种算法和数据结构,旨在为不同阶段的编程学习者提供一条清晰、平稳的学习提升路径。 欢迎大家订阅我的专栏:算法…

📅 2026/10/9 1:27:10
题解:洛谷 P9013 [USACO23JAN] Find and Replace S(废)

题解:洛谷 P9013 [USACO23JAN] Find and Replace S(废)

本文分享的必刷题目是从蓝桥云课、洛谷、AcWing等知名刷题平台精心挑选而来,并结合各平台提供的算法标签和难度等级进行了系统分类。题目涵盖了从基础到进阶的多种算法和数据结构,旨在为不同阶段的编程学习者提供一条清晰、平稳的学习提升路径。 欢迎大家订阅我的专栏:算法…

📅 2026/10/9 1:27:10
MORE NEWS

更多资讯

📰

现代 JavaScript 教程实战:用 cubic-bezier 让 CSS 尺寸动画“跳脱“边界(飞机缩放回弹动画)

文档教程前端 【免费下载链接】zh.javascript.info 现代 JavaScript 教程(The Modern JavaScript Tutorial),以最新的 ECMAScript 规范为基准,通过简单但足够详细的内容,为你讲解从基础到高阶的 JavaScript 相关知识。…

📰

models.dev Issue Fixer 自动化深度解析:从 GitHub Issue 到模型目录数据修复 PR 的完整工作流

人工智能大模型后端前端 【免费下载链接】models.dev An open-source database of AI models. 项目地址: https://gitcode.com/gh_mirrors/mo/models.dev 点击查看 免费下载 导读 本文围绕 models.dev 仓库中的自动化 Issue 修复 Agent 配置文档 issue-fixer.md 展…

📰

Hyperf 分佈式事務實戰:基於 DTM 的 TCC、Saga、XA 與二階段消息完整指南

后端微服务 【免费下载链接】hyperf 🚀 A coroutine framework that focuses on hyperspeed and flexibility. Building microservice or middleware with ease. 项目地址: https://gitcode.com/gh_mirrors/hy/hyperf 点击查看 免费下载 本篇技術指南以…

📰

PaddleNLP 土耳其语模型 dbmdz/bert-base-turkish-uncased 下载与使用实战指南

人工智能深度学习计算机视觉NLP语音 【免费下载链接】models Officially maintained, supported by PaddlePaddle, including CV, NLP, Speech, Rec, TS, big models and so on. 项目地址: https://gitcode.com/gh_mirrors/mo/models 点击查看 免费下载 本篇技术指…

📰

资源稀缺信号与约束内构建:let-fate-decide 中 Five of Pentacles(五角星五)的工程技术解读

AI 技能AI 插件应用安全网络安全AI 评测 【免费下载链接】skills Trail of Bits Claude Code skills for security research, vulnerability detection, and audit workflows 项目地址: https://gitcode.com/gh_mirrors/skills8/skills 点击查看 免费下载 Five of …

📰

ResNet优化模型实现阿尔茨海默症MRI识别:课程设计实战指南

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

TODAY

今日更新

THIS WEEK

本周精选

THIS MONTH

本月热门

读完文章,想聊聊您的网站?

告诉我们您的行业与需求,资深顾问一对一梳理方案与报价,全程免费。

📞 💬