javascript正则表达式RegExp入门图文教程

下面是关于“javascript正则表达式RegExp入门图文教程”的完整攻略。

一、什么是正则表达式？

正则表达式（regular expression），又称正规表示式、正规表示法、规则表示法、常规表示法（英语：Regular Expression，缩写：regex、regexp），是计算机科学的一个概念。正则表达式是一种用来匹配字符串的强有力的武器。对于很多初学者来说，正则表达式的语法十分晦涩难懂，但是一旦掌握了它，它可以让我们在文本处理等方面变得高效和灵活。

二、什么是RegExp对象？

在JavaScript中，正则表达式由RegExp对象表示。RegExp对象正如其名：它是一个描述字符串如何匹配某个模式的对象（pattern）。当使用RegExp对象表示正则表达式时，可以使用正则表达式描述字符串中的文本模式，然后使用这个模式可对一个字符串进行匹配、筛选、替换和分割。下面是RegExp对象的一些常见属性和方法。

2.1 RegExp对象的属性

RegExp对象常见的属性包括：

• RegExp.prototype.global 是否使用全局搜索
• RegExp.prototype.ignoreCase 忽略大小写
• RegExp.prototype.multiline 是否使用多行模式
• RegExp.prototype.source 正则表达式源文本字符串

2.2 RegExp对象的方法

RegExp对象常见的方法包括：

• RegExp.prototype.exec() 用于在字符串中查找匹配的文本。返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回null；
• RegExp.prototype.test() 用于检测一个字符串是否匹配某个正则表达式。返回值为true或false；
• String.prototype.match() 返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回null；
• String.prototype.search() 用于查找字符串中的指定子字符串，或查找与正则表达式相匹配的子字符串。返回第一个匹配的子串的起始位置，如果未找到，则返回-1；
• String.prototype.replace() 在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。返回用替换字符替换了匹配子串后的结果新字符串；
• String.prototype.split() 将一个字符串分割成字符串数组。

三、正则表达式的语法

正则表达式里的特殊字符不仅包含了一些特殊的字符，还包括某些字符的组合、上下文环境、不同的Unicode字符等等。接下来，我们将一步步介绍正则表达式的基本语法。

3.1 字符类

字符类是用来表示一组字符中的一个的特殊符号。比如，[abc]表示匹配字符"a"、"b"或者"c"，[^abc]表示匹配任何不在括号中的字符。

以下是字符类的一些常见语法：

语法	描述
[abc]	查找方括号之间的任何字符。
[^abc]	查找任何不在方括号之间的字符。
[0-9]	查找任何从 0 至 9 的数字。
[a-z]	查找任何从小写 a 到小写 z 的字符。
[A-Z]	查找任何从大写 A 到大写 Z 的字符。
[A-z]	查找任何从大写 A 到小写 z 的字符。
[adgk]	查找给定的字符集内的任何字符。
[^adgk]	查找给定字符集外的任何字符。
(red|blue|green)	查找任何指定的选项

3.2 元字符

元字符是正则表达式的基础，它们为正则表达式提供了其强大的功能。元字符是在正则表达式里有特殊含义的非字母字符。以下是一些常见的元字符：

元字符	描述
.	查找单个字符，除了换行和行结束符。
\w	查找单个字符，包括数字、字母和下划线。
\W	查找任何非单词字符。
\d	查找数字。
\D	查找非数字字符。
\s	查找空白字符，包括空格、制表符、换行符等。
\S	查找非空白字符。
\b	匹配单词边界。
\B	匹配非单词边界。
\n	查找换行符。
\r	查找回车符。
\t	查找制表符。
\v	查找垂直制表符。

3.3 重复字符

重复字符允许我们重复匹配在它之前出现的元素，例如，"a{1,3}"将匹配字符"a"、"aa"和"aaa"。以下是一些常见的重复字符：

语法	描述
n+	匹配任何至少包含一个 n 的字符串。
n*	匹配任何包含零个或多个 n 的字符串。
n?	匹配任何包含零个或一个 n 的字符串。
n{x}	匹配包含 x 个 n 的序列的字符串。
n{x,y}	匹配包含 x 个或 y 个 n 的序列的字符串。
n{x,}	匹配包含至少 x 个 n 的序列的字符串。
n{0,}	等同于 n*。
n{1,}	等同于 n+。

四、RegExp对象的使用

我们以一个简单的例子来说明如何使用RegExp对象：

var str = "Hello world! This is a test string for regexp.";
var patt = /world/i; // i表示不区分大小写
var result = patt.test(str); // 匹配则返回true，否则返回false
console.log(result);

输出结果为：true。

下面再举一个稍微复杂一点的例子。假设有一个表单，用户需要输入邮箱地址和手机号码。当用户输入完邮箱和手机号码后，我们需要判断这两个输入框中的内容是否符合规定，如果不符合规定，就提示用户修改输入。

// 获取表单中的输入框元素
var emailInput = document.getElementById("email");
var phoneInput = document.getElementById("phone");

// 为输入框添加blur事件监听器
emailInput.addEventListener("blur", function() {
  var email = emailInput.value;
  var patt = /^\w+@[a-zA-Z0-9]+\.[a-zA-Z]{2,}$/; // 匹配邮箱地址的正则表达式
  if (!patt.test(email)) { // 如果不匹配
    alert("请输入正确格式的邮箱地址！");
    emailInput.value = ""; // 清空输入框
  }
});

phoneInput.addEventListener("blur", function() {
  var phone = phoneInput.value;
  var patt = /^1[3-9]\d{9}$/; // 匹配手机号码的正则表达式
  if (!patt.test(phone)) { // 如果不匹配
    alert("请输入正确格式的手机号码！");
    phoneInput.value = ""; // 清空输入框
  }
});

在以上代码中，我们通过RegExp对象来创建了两个正则表达式，一个用于匹配邮箱地址，一个用于匹配手机号码。当用户输入完邮箱和手机号码后，我们使用test()方法来判断输入是否符合规定，如果不符合，则弹出提示框并清空输入框。

至此，我们介绍了RegExp对象和正则表达式的一些基本知识，并用代码示例演示了如何使用RegExp对象来匹配字符串。希望能对你有所帮助。