迹忆客 专注技术分享

当前位置:主页 > 学无止境 > WEB前端 > JavaScript >

JavaScript 中的电话号码正则表达式

作者:迹忆客 最近更新:2024/03/19 浏览次数:

每个国家都有自己的数字格式,在我们将这些数据存储到数据库之前,我们需要确保用户输入的数字格式正确。在这篇文章中,我们将学习如何在 JavaScript 中为电话号码编写正则表达式。


JavaScript 中的 RegEx

正则表达式就像一个搜索工具,可以在字符串中找到特定的模式。学习 RegEx 的一个很好的资源是 https://regexr.com。JavaScript 还支持将正则表达式作为对象。这些模式与 matchAll()match()replaceAll()replace()search()split() 一起使用。构造正则表达式有两种方式,使用字面量的正则表达式和调用 RegExp 对象的构造函数。

在继续讨论电话号码 RegEx 之前,让我们先了解一些常见模式。

  • \d:此正则表达式匹配任何数字/数字。它类似于 [0-9]
  • \w:此正则表达式匹配 A-Za-z0-9_ 范围内的任何给定单词字符代码。
  • \s:此正则表达式匹配每个空白字符,例如空格、制表符、换行符。
  • \b:此正则表达式匹配单词字符和非单词字符之间的任何单词边界位置或位置(字符串的开头/结尾)。
  • [A-Z]:此正则表达式匹配 A-Z 范围内的任何给定字符代码。
  • [0-9]:此正则表达式匹配 0-9 范围内的任何给定字符代码。
  • (?:ABC):此正则表达式将多个标记组合在一起而不创建捕获组。

每个 RegEx 都包含下面列出的某些标签:

  • i:这个标志意味着它不区分大小写,这意味着整个表达式不区分大小写。
  • g:此标志表示全局搜索,它维护最后一个匹配项的索引,以便后续搜索可以从前一个匹配项的末尾开始。如果没有全局标志,后续搜索将返回相同的匹配项。
  • m:这个标志表示多行。当多行标志打开时,开始和结束锚点(^$)匹配一行的开头和结尾,而不是整个链的开头和结尾。
  • u:此标志表示 Unicode。用户可以通过激活此标志来使用 \ x {FFFFF} 形式的扩展 Unicode 转义。
  • y:这个标志意味着粘性。该表达式仅匹配其 lastIndex 位置,并忽略全局标志 (g)(如果已设置)。由于 RegEx 中的每次搜索都是离散的,因此该指标对显示的结果没有进一步的影响。
  • s:该标志表示 dotAll。句点 (.) 匹配每个字符,包括新行。

JavaScript 中正则表达式的语法

const regEx = /pattern/;
const regEx = new RegExp('pattern');

示例代码:

<form name="form1">
  <input type='text' id="phoneNumber" name='text1'/>
  <button type="submit" name="submit" onclick="phonenumber()">Submit</button>
</form>
function phonenumber() {
  const indiaRegex = /^\+91\d{10}$/;
  const inputText = document.getElementById('phoneNumber').value;
  if (inputText.match(indiaRegex)) {
    console.log('Valid phone number');
  } else {
    console.log('Not a valid Phone Number');
  }
}

输出:

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

JavaScript === vs ==

发布时间:2024/03/19 浏览次数:87 分类:JavaScript

本教程教授何时使用哪个等号运算符(== 或 ===)。

JavaScript 中的双感叹号运算符示例

发布时间:2024/03/19 浏览次数:194 分类:JavaScript

JavaScript 双感叹号!!(不是不)提供与布尔表达式相同的结果(真,假)。JavaScript 中的双感叹号运算符是一元逻辑运算符 !(not) 的单次重复。

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便