正则表达式的基本使用

最新推荐文章于 2022-07-10 18:20:08 发布

小豪boy

最新推荐文章于 2022-07-10 18:20:08 发布

阅读量247

点赞数

分类专栏： JavaScript学习笔记文章标签：正则表达式

本文链接：https://blog.csdn.net/qq_34771938/article/details/120384888

版权

JavaScript学习笔记专栏收录该内容

40 篇文章 2 订阅

订阅专栏

正则表达式的创建

使用/内容/的语法形式，可以快速创建正则表达式。
也可以使用new RegExp('内容')的形式，创建正则表达式。
使用typeof运算符检查正则表达式的类型，结果是object。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 创建正则表达式方法1
        var regexp1 = /^\d{6}$/;
        // 创建正则表达式方法2
        var regexp2 = new RegExp('^\\d{6}$');

        var str = '555666';

        console.log(regexp1.test(str));     // true
        console.log(regexp2.test(str));     // true

        console.log(typeof regexp1);        // object
        console.log(typeof regexp2);        // object
    </script>
</body>
</html>

元字符

“元字符”是指一位指定类型的字符。

元字符

功能

\d

匹配一个数字

\D

匹配一个非数字字符

\w

匹配一个单字字符（字母、数字或者下划线）

\W

匹配一个非单字字符

\s

匹配一个空白字符，包括空格、制表符和换行符

.

任意字符

元字符	功能
\d	匹配一个数字
\D	匹配一个非数字字符
\w	匹配一个单字字符（字母、数字或者下划线）
\W	匹配一个非单字字符
\s	匹配一个空白字符，包括空格、制表符和换行符
.	任意字符

开头和结尾

元字符

功能

^

匹配开头

$

匹配结尾

元字符	功能
^	匹配开头
$	匹配结尾

元字符注意事项

如果使用new RegExp()写法，反斜杠需要多写一个。
比如/^\d$/和new RegExp('^\\d$')是相同的意思。

元字符使用举例

某快递公司运单号形式是这样的：123-4567-890，请使用正则表达式检查某字符串是否符合此格式。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 正则表达式
        var regexp1 = /^\d\d\d-\d\d\d\d-\d\d\d$/;
        // 待测试的字符串
        var str1 = '444-5555-000';
        console.log(regexp1.test(str1));    // true
    </script>
</body>

</html>

某产品的验证秘钥形式是这样的：□□□-□□□□-□□□，其中□表示字母数字或者下划线，请使用正则表达式检查某字符串是否符合此格式。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 正则表达式
        var regexp2 = /^\w\w\w-\w\w\w\w-\w\w\w$/;
        // 待测试的字符串
        var str2 = 'abc-__ab-123';
        console.log(regexp2.test(str2)); // true
    </script>
</body>

</html>

字符的转义

在特殊字符之前的反斜杠\表示下一个字符不是特殊字符，应该按照字面理解。

不管一个符号有没有特殊意义，都可以在其之前加上一个\以确保它表达的是这个符号本身。
举例：某产品批号形式为：123.45^67#89，请使用正则表达式检查某字符串是否符合此格式。
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 题目3：某产品批号形式为：123.45^67#89，请使用正则表达式检查某字符串是否符合此格式
        var regexp3 = /^\d\d\d\.\d\d\^\d\d\#\d\d$/;
        // 待测试的字符串
        var str3 = '666.66^66#66';
        var str4 = '123.45^67#89';
        console.log(regexp3.test(str3)); // true
        console.log(regexp3.test(str4)); // true
    </script>
</body>

</html>

方括号表示法

使用方括号，比如[xyz]，可以创建一个字符集合，表示匹配方括号中的任意字符。
比如某学校的学号规定：第1位是一个字母，b表示本科生， y表示研究生，后面是7位数字，用正则表示为：

可以使用短横-来指定一个字符范围，^表示否定。

元字符

等价的方括号表示法

\d

[0-9]

\D

[^0-9]

\w

[A-Za-z0-9_]

\W

[^A-Za-z0-9_]

元字符	等价的方括号表示法
\d	[0-9]
\D	[^0-9]
\w	[A-Za-z0-9_]
\W	[^A-Za-z0-9_]

方括号表示法小题目

题目1：请验证某字符串是否是5位字母，大小写均可。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 题目1：请验证某字符串是否是5位字母，大小写均可
        var str2 = 'abcde';
        var str3 = 'abcd5';
        console.log(/^[a-zA-Z]{5}$/.test(str2)); // true
        console.log(/^[a-zA-Z]{5}$/.test(str3)); // false
    </script>
</body>

</html>

题目2：请验证某字符串是否是5位，且仅有小写字母、点构成。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 题目2：请验证某字符串是否是5位，且仅由小写字母、点构成
        var str4 = 'mnp..';
        var str5 = 'mnp.#';
        console.log(/^[a-z\.]{5}$/.test(str4)); // true
        console.log(/^[a-z\.]{5}$/.test(str5)); // false
    </script>
</body>

</html>

题目3：请验证某字符串是否是4位小写字母，且最后一位不能是m字母。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 题目3：请验证某字符串是否是4位小写字母，且最后一位不能是m字母
        var str6 = 'abcd';
        var str7 = 'abcm';
        var str8 = 'ab1c';
        console.log(/^[a-z]{3}[a-ln-z]$/.test(str6)); // true
        console.log(/^[a-z]{3}[a-ln-z]$/.test(str7)); // false
        console.log(/^[a-z]{3}[a-ln-z]$/.test(str8)); // false
    </script>
</body>

</html>

量词

量词

意义

*

匹配前一个表达式0次或多次。等价于{0,}

+

匹配前面一个表达式1次或者多次。等价于{1,}

?

匹配前面一个表达式0次或者1次。等价于{0,1}

{n}

n是一个正整数，匹配了前面一个字符刚好出现了n次

{n,}
n是一个正整数，匹配前一个字符至少出现了n次

{n,m}

n和m都是整数。匹配前面的字符至少n次，最多m次

量词	意义
*	匹配前一个表达式0次或多次。等价于{0,}
+	匹配前面一个表达式1次或者多次。等价于{1,}
?	匹配前面一个表达式0次或者1次。等价于{0,1}
{n}	n是一个正整数，匹配了前面一个字符刚好出现了n次
{n,}	n是一个正整数，匹配前一个字符至少出现了n次
{n,m}	n和m都是整数。匹配前面的字符至少n次，最多m次

量词小题目

题目1：请验证字符串是否符合手机号码的规则：11位数字，并且肯定以1开头。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 题目1：请验证字符串是否符合手机号码的规则：11位数字，并且肯定以1开头
        var str1 = '13812345678';
        var str2 = '138123456789';
        var str3 = '38123456789';
        var regexp1 = /^1\d{10}$/;
        console.log(regexp1.test(str1)); // true
        console.log(regexp1.test(str2)); // false
        console.log(regexp1.test(str3)); // false
    </script>
</body>

</html>

题目2：请验证某字符串是否是这样的：以字母开头，中间是任意位数字（最少1位）构成，并以字母结尾。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 题目2：请验证某字符串是否是这样的：以字母开头，中间是任意位数字（最少1位）构成，并以字母结尾
        var str4 = 'a123123123b';
        var str5 = 'abcd';
        var str6 = 'a1b';
        var regexp2 = /^[a-zA-Z]\d+[a-zA-Z]$/;
        console.log(regexp2.test(str4)); // true
        console.log(regexp2.test(str5)); // false
        console.log(regexp2.test(str6)); // true
    </script>
</body>

</html>

题目3：请验证某字符串是否符合网址规则：以www.开头，中间是任意位的字符（字母数字下划线），最后以.com结尾，也可以以.com.cn结尾。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 题目3：请验证某字符串是否符合网址规则：以www.开头，中间是任意位的字符（字母数字下划线，最少一位），最后以.com结尾，也可以以.com.cn结尾
        var str7 = 'www.imooc.com';
        var str8 = 'www.sina.com.cn';
        var str9 = 'www.news.cn';
        var regexp3 = /^www\.\w+\.com(\.cn)?$/;
        console.log(regexp3.test(str7)); // true
        console.log(regexp3.test(str8)); // true
        console.log(regexp3.test(str9)); // false
    </script>
</body>

</html>

修饰符

修饰符也叫作标志（flags），用于使用正则表达式实现高级搜索。

修饰符

意义

i
不区分大小写搜索

g
全局搜索

修饰符的使用：

修饰符	意义
i	不区分大小写搜索
g	全局搜索

小豪boy

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
正则表达式的基本使用

正则表达式的创建使用/内容/的语法形式，可以快速创建正则表达式。也可以使用newRegExp('内容')的形式，创建正则表达式。使用typeof运算符检查正则表达式的类型，结果是object。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, i.
复制链接

扫一扫

专栏目录