JavaScript基础之正则表达式

1.概念

正则表达式（Regular Expression）是用于描述一组字符串特征的模式，用来匹配特定的字符串。通过特殊字符+普通字符来进行模式描述，从而达到文本匹配目的工具。

正则表达式目前被集成到了各种文本编辑器/文本处理工具当中

2.创建方式

     (1) 字面量创建

var reg = /day/ig;

     (2)  构造函数创建

var reg = new RegExp("day","ig");

3.语法

    (1) 规则(表达式)   写在 // 之间

     2. 修饰符 i (忽略大小写)   g (全局匹配(匹配整个字符串 多次,也称为贪婪模式) 如果不加g默认只匹配一次,也称为非贪婪模式)

// 没有加忽略大小写
var str = "good good study , Day dAy up";
var reg = /day/;
var result = str.search(reg);//search方法是返回某个或某段字符 在字符串中第一次出现的位置   => 存在 返回下标,不存在返回-1
console.log(result);//-1

// 加忽略大小写
var str = "good good study , Day dAy up";
var reg = /day/i;//忽略大小写
var result = str.search(reg);
console.log(result);//18

// 开启非贪婪模式
var str = "good good study , day day up";
var reg = /day/; //忽略大小写
var result = str.replace(reg, "money");
console.log(result); //good good study , money day up

// 开启贪婪模式
var str = "good good study , day day up";
var reg = /day/g; //忽略大小写 全局匹配
var result = str.replace(reg, "money");
console.log(result); //good good study , money money up

 

4. 正则的相关方法

     (1) test()   判断字符串中是否 含有 符合规则的 某个或某段字符 有=> true, 没有=>false

var str = "good good study , Day dAy up";
var reg = /day/;
var result = reg.test(str);
console.log(result); //false

var str = "good good study , Day dAy up";
var reg = /day/ig;
var result = reg.test(str);
console.log(result); //true

    (2)  exec()  将符合规则的某个或某段字符提取出来放到数组中(始终只匹配一次),如果没有则返回null

var str = "good good study , Day dAy up";
var reg = /day/ig;
var result = reg.exec(str);
console.log(result);

输出结果: 

                

   (3)  lastIndex  返回下一次匹配时下标的开始位置(默认 0) (前提:全局匹配)

var str = "good good study , Day dAy up";
var reg = /day/ig;
console.log(reg.lastIndex);// 0
var result = reg.test(str);
console.log(result, reg.lastIndex);// true  21

var result = reg.test(str);
console.log(result, reg.lastIndex);// true  25

var result = reg.test(str);
console.log(result, reg.lastIndex);// false  0

5.  正则表达式中的字符

     (1) 字面量字符(普通字符)    

            a-z  A-Z  0-9

     (2) 元字符(特殊字符)

            1.限定符   指定正则表达式中的给定组件(某个或某段字符=> 子表达式)需要匹配多次才满足

                         *   匹配前面的子表达式出现0次或多次

                        +   匹配前面的子表达式出现1次或多次  {1,}

                        ?   匹配前面的子表达式出现0次或1次   {0,1}

                       {n}  匹配n次

                       {n,}  匹配至少n次

                       {n,m} 匹配至少n次,最多m次

            实例:

//  *   匹配前面的子表达式出现0次或多次
var str = "Mondy";
var reg = /da*y/ig; //可以匹配 dy day daay daay....
var result = reg.test(str);
console.log(result); //true

// +   匹配前面的子表达式出现1次或多次  {1,}
var str = "Mondy";
var reg = /da+y/ig; //可以匹配 day daay daay....
var result = reg.test(str);
console.log(result); //false

// ?   匹配前面的子表达式出现0次或1次   {0,1}
var str = "Mondy";
var reg = /da?y/ig; //可以匹配 dy day
var result = reg.test(str);
console.log(result); //true

//  {n}  匹配n次
var str = "Mondaaay";
var reg = /da{3}y/ig; //可以匹配 daaay
var result = reg.test(str);
console.log(result); //true

// {n,}  匹配至少n次
var str = "Mondaay";
var reg = /da{2,}y/ig; //可以匹配 daay daaay...
var result = reg.test(str);
console.log(result); //true

// {n,m} 匹配至少n次,最多m次
var str = "Mondaaay";
var reg = /da{2,3}y/ig; //可以匹配 daay daaay
var result = reg.test(str);
console.log(result); //true

            2. 定位符

                     ^  匹配字符串开始的位置  以...开头

                     $  匹配字符串结束的位置  以...结尾

    Tips:

           单独使用 ^和$ 依旧是包含关系  不会将规则定死

           同时使用 ^和$  才会在一定程度上将规则定死 

            3. 字符匹配符

                     [xyz]  字符集合,匹配xyz中的任意一个字符

                     [0123456789]    => [0-9]   匹配数字

                     [qwertyuiopasdfghjklzxcvbnm]   => [a-z]  匹配 小写字母

                     [QWERTYUIOPASDFGHJKLZXCVBNM]   => [A-Z]  匹配 大写字母

                     [0-9a-zA-Z_]  匹配数字 大小写字母 _中的任意一个

   注意在字符匹配符中 ^ 代表取反

               [^xyz]  匹配除了 xyz以外的任意一个字符

               [^0-9]  匹配非数字  但是范围太大

               [^a-z]  匹配非小写  

               [^A-Z]  匹配非大写  

               [^0-9a-zA-Z_]  匹配非数字 大小写字母 _ 

          字符簇 (官方已经规定好的字符集合)

                    \d    匹配数字   [0-9]

                    \D    匹配非数字  [^0-9]

                    \w    匹配数字 大小写字母 _  [0-9a-zA-Z_]

                    \W    匹配非数字 大小写字母 _  [^0-9a-zA-Z_]

                    \s    匹配空白字符(换行符(\n)产生的空格/ 回车符(\r)产生空格 / 空格)

                    \S   匹配非空白字符 (除了空白符以外的任意字符)

                    .     匹配除换行符(\n)以外的单个字符(任意字符)

                   [\u4e00-\u9fa5]  匹配中文

           关于空白字符

                   \n   换行符 

                   \r   回车符 

                   \f   分页符

                   \t   制表符

                   \v   垂直制表符

         转义字符

Tips:   其中 \ 为转义字符,在表示某一些特殊含义的字符时,需要添加"\"转义字符,例如:要匹配+,就要写成\+

var str = "1+1";
var reg = /1+1/;
var result = reg.test(str);
console.log(result); // false

var str = "1+1";
var reg = /1\+1/;
var result = reg.test(str);
console.log(result); // true

         4.选择匹配符

                 | 可以匹配多个规则(在正则表达式中代表"或"的关系 一般配合() 使用)

                            /(red|blue|green)/   匹配red ,blue green中的任意一个

  6.综合案例

          实例1:

// 手机号验证
var phone = "17786531572";
var reg = /^1[3-9][0-9]{9}$/;
var result = reg.test(phone );
console.log(result);//true

          实例2:

// 用户名验证
var user = "aaaaa哈哈";
var reg = /^[a-zA-Z][\w$_\u4e00-\u9fa5]{5,11}$/;
var result = reg.test(user );
console.log(result); //true

           实例3:

// 邮箱验证
var email = "tigers@qq.com";
var reg = /^\w{6,18}@\w+\.(com|cn|edu)$/;
var result = reg.test(email );
console.log(result); //true

          实例4: 

// 网址验证
var str = "https://www.baidu.com";
var reg = /^(http|https):\/\/(www.)?\w{2,}\.(com|edu|cn|net)$/;
var result = reg.test(str);
console.log(result); //true

          实例5: 

// 日期判断验证
var str = "2021-1-7";
var reg = /^\d{4}-\d{1,2}-\d{1,2}$/;
var result = reg.test(str);
console.log(result); //true

          实例6: 

// QQ号判断验证
var str = "534532";
var reg = /^[1-9]\d{4,}$/;
var result = reg.test(str);
console.log(result); //true