乐趣区

关于前端:现代JavaScript高级教程正则表达式的常见问题与练习

jiezi
点击在线浏览，体验更好 链接
古代 JavaScript 高级小册 链接
深入浅出 Dart 链接
古代 TypeScript 高级小册 链接

正则表达式的常见问题与练习

正则表达式是面试中常常被提及的主题之一，但很多人在面试中对于正则表达式的问题经常感到困惑。在本节中，我将通过一些常见问题和练习题目来帮忙你更好地了解和把握正则表达式的技巧。

问题一：JavaScript 中的字符串与正则表达式操作

在 JavaScript 中，咱们能够应用三个办法来操作字符串和正则表达式：test、exec 和 match。上面是它们的具体用法及括号在这些办法中的作用。

  1. RegExp.prototype.test(): test 是 JavaScript 中正则表达式对象的一个办法，用于检测正则表达式对象与传入的字符串是否匹配。如果匹配，则返回 true，否则返回 false。应用办法如下：

    regexObj.test(str);

    示例：

    /Jack/.test('ack'); // false

    在 test 办法中，括号只起到分组的作用，例如：

    /123{2}/.test('123123'); // false
/(123){2}/.test('123123'); // true

  2. String.prototype.match(): match 是字符串的办法，它承受一个正则表达式作为参数，并返回字符串中与正则表达式匹配的后果。在 match 办法中，括号的作用有两个：

    • 分组
    • 捕捉。捕捉的意思是将用户指定的匹配到的子字符串暂存并返回给用户。

    当传入的正则表达式没有应用 g 标记时，返回一个数组。数组的第一个值为第一个残缺匹配，后续的值别离为括号捕捉的所有值，并且数组还蕴含以下三个属性：

    • groups：命名捕捉组
    • index：匹配后果的开始下标
    • input：传入的原始字符串

    示例：

    const result1 = '123123'.match(/123{2}/); // null
const result2 = '123123'.match(/(123){2}/); // ["123123", "123", index: 0, input: "123123", groups: undefined]
console.log(result2.index); // 0
console.log(result2.input); // 123123
console.log(result2.groups); // undefined

    当传入的正则表达式有 g 标记时，将返回所有与正则表达式匹配的后果，疏忽捕捉。

  3. RegExp.prototype.exec(): exec 是正则表达式的办法，它承受一个

字符串作为参数，并返回与正则表达式匹配的后果。返回后果是一个数组，其中蕴含了匹配到的信息。在 exec 办法中，括号的作用同样是分组和捕捉。

当传入的正则表达式没有应用 g 标记时，每次调用 exec 办法都会返回第一个匹配后果的信息数组，包含匹配的字符串、分组捕捉的值以及其余属性。

示例：

const regex = /(\d+)([a-z])/;
const str = '123a';
let result;

while ((result = regex.exec(str)) !== null) {console.log(result[0]); // 123a
  console.log(result[1]); // 123
  console.log(result[2]); // a
  console.log(result.index); // 0
  console.log(result.input); // 123a
  console.log(result.groups); // undefined

  regex.lastIndex = result.index + 1; // 设置下次匹配开始的地位
}

当传入的正则表达式有 g 标记时，exec 办法将继续查找匹配的后果。

问题二：在正则表达式中匹配多个空格

有时候，咱们心愿匹配间断的多个空格，能够应用正则表达式中的特殊字符 \s。

示例：

const str = 'Hello    World';
const regex = /\s+/;
const result = str.split(regex);
console.log(result); // ["Hello", "World"]

在上述示例中，咱们应用 \s+ 匹配间断的多个空格，并通过 split 办法将字符串宰割成数组。后果中的多个空格被去除，只留下了单词。

问题三：在正则表达式中匹配邮箱地址

匹配邮箱地址是正则表达式中的一个常见需要。上面给出一个简略的匹配规定：

const regex = /^[A-Za-z0-9]+@[A-Za-z0-9]+\.[A-Za-z]{2,}$/;

这个正则表达式的意思是匹配由字母、数字组成的用户名，紧接着是一个 @ 符号，而后是由字母、数字组成的域名，最初是一个以两个或更多字母组成的顶级域名。

示例：

const email = 'example@example.com';
const regex = /^[A-Za-z0-9]+@[A-Za-z0-9]+\.[A-Za-z]{2,}$/;
console.log(regex.test(email)); // true

在上述示例中，咱们应用 test 办法检测邮箱地址是否合乎正则表达式的规定。

问题四：在正则表达式中替换字符串

在 JavaScript 中，咱们能够应用 String.prototype.replace() 办法来替换字符串中的内容。正则表达式能够用于指定要替换的模式。

示例：

const str = 'Hello, World!';


const regex = /World/;
const newStr = str.replace(regex, 'JavaScript');
console.log(newStr); // "Hello, JavaScript!"

在上述示例中，咱们应用 replace 办法将字符串中的 “World” 替换为 “JavaScript”。

问题五：在正则表达式中应用修饰符

在正则表达式中，修饰符是在正则表达式主体前面的字符，用于管制匹配模式的行为。

常见的修饰符有：

  • i：不辨别大小写进行匹配。
  • g：全局匹配，匹配到一个后果后持续查找下一个匹配项。
  • m：多行匹配，容许匹配换行符。

示例：

const str = 'Hello, hello, hElLo!';
const regex = /hello/i;
const result = str.match(regex);
console.log(result); // ["Hello"]

在上述示例中，咱们应用修饰符 i 来实现不辨别大小写的匹配。正则表达式 /hello/i 匹配到了字符串中的 “Hello”。

练习题

尝试解决以下正则表达式的练习题目。

  1. 匹配手机号码：

    const regex = /^1[3456789]\d{9}$/;

    这个正则表达式能够用来匹配中国大陆的手机号码，以 “1” 结尾，前面追随 10 个数字。

  2. 匹配身份证号码：

    const regex = /^\d{17}(\d|X|x)$/;

    这个正则表达式能够用来匹配中国大陆的身份证号码，由 17 位数字和一位数字或字母 “X”（不辨别大小写）组成。

  3. 匹配 URL：

    const regex = /^(https?|ftp):\/\/[^\s/$.?#].[^\s]*$/;

这个正则表达式能够用来匹配以 “http://”、”https://” 或 “ftp://” 结尾的 URL。

退出移动版