第 8 节 正则表达式大纲

相关资料

1. 在线匹配 http://tool.oschina.net/regex/
2. 百度前端助手

(一)创建正则表达式对象

///////前言//////
<script>
    // 字面量的方式创建对象
    var obj = {
        a: 2,
        b: 3
    };
    // 构造函数方式创建对象,构造函数是用来创建对象
    var obj1 = new Object();
    obj1.name = 'zhangsan';
    // 字面量
    var arr = [1, 2, 3];
    // 构造函数
    var arr1 = new Array();
    arr1[0] = 1;
    arr1[1] = 2;
</script>

1.1 字面量方式

 // 1.方式1: 使用字面量方式创建对象
    var reg = /xinlang/;
    var str = 'xinlangasdfasdf';
    // 检验字符串是否匹配正则表达式,用test
    var boo = reg.test(str);
    console.log('boo', boo); // true

1.2 new 关键字

// 2.方式2: 使用构造函数方式创建正则对象
    var reg2 = new RegExp('zhanghuan');
    var str = 'asdfasdfzhanghuanasdfasdf';
    var boo2 = reg2.test(str);
    console.log('boo2', boo2); //

1.3 正则表达式参数

// 3.正则表达式参数g-全局匹配,i-忽略大小写,m-多行匹配
    var reg3 = /zhanGsan/gi;
    // var reg3 = new RegExp('zhangsan','g');
    var str3 = '111111111zhangsan222222zhangsan333333zhangsan';
    var newStr3 = str3.replace(reg3, '张三');
    console.log('newStr3', newStr3);

(二)常用匹配规则

https://www.baidufe.com/item/eb10deb92f2c05ca32cf.html

 var log = function() {
        var len = arguments.length;
        if (len === 1) {
            console.log(arguments[0])
        } else if (len === 2) {
            console.log(arguments[0], arguments[1]);
        } else {
            console.log(arguments[0], arguments[1], arguments[2]);
        }
        console.log('')
    }

1. 任意字符 .

var reg1 = /.../;
var str1 = 'aa';
console.log('boo1', reg1.test(str1)); // false

2. \w 字母、数字、下划线

var reg2 = /\w\w/;
var str2 = 'as';
console.log('boo2', reg2.test(str2)); // true
console.log('boo2', reg2.test('$a')); // false

3. \s 任意空白字符

var reg3 = /..\s../;
console.log('boo3', reg3.test('aa bb')); // true
console.log('boo3', reg3.test('aa   bb')); // true

4. \d 匹配数字，等同于[0-9]

var reg4 = /\d\d\d\d/;
console.log('boo4', reg4.test('9999')); // true

5. \D 匹配非数字，等同于[^0-9]

var reg5 = /\d\D\d/;
console.log('boo5', reg5.test('233')); // false
console.log('boo5', reg5.test('2a3')); // true

6. | 或匹配，如 /x|y/ 正则可匹配 x 或 y 两个字符

var reg6 = /abc|xyz/;
console.log('boo6', reg6.test('asdfasdfabcasdfasdf')); // true
console.log('boo6', reg6.test('asdfasdfxyzasdfasdf')); // true

7. [xyz] 表示包含 xyz 里面的任意一个,相当于x|y|z

var reg7 = /[abc]/;
log('boo7', reg7.test('aaa')); // true
log('boo7', reg7.test('ddd')); // false

// [a-zA-Z] // 匹配所有的大小写字母

var reg7 = /[a-zA-Z]/;
var reg7 = /[0-9]/; // 匹配0到9,相当于\d

8. [^x] 匹配除“x”之外的所有字符，其中“x”可以为任意字符

var reg8 = /[^s]/;
log('boo8', reg8.test('asdf')); // true
log('boo8', reg8.test('sss')); // false

9. [^xyz] 同上，匹配除“x、y、z”之外的任意字符

var reg9 = /[^abc]/; // 存在abc以外的字符都能匹配
log('boo9', reg9.test('d')); // true
log('boo9', reg9.test('ab')); // false

10. ^ 匹配字符串的开始

var reg10 = /^[a-zA-Z]\w\w\w/; // 匹配:第一个字符是字母,紧跟三个字符(数字,字母或下划线)
log('boo10', reg10.test('a_8al2k323')); // true
log('boo10', reg10.test('8a_8al2k323')); // false

11. $ 匹配字符串的结束

var reg11 = /^1\d\d\d\d\d\d\d\d\d\d$/; // 11位数字
log('boo11', reg11.test('13811111111')); // true
log('boo11', reg11.test('23811111111')); // false

12. \x 转义字符

var reg12 = /\.com/;
log('boo12', reg12.test('acom')); // false
log('boo12', reg12.test('asdfasdf.com')); // true
// '2021/05/05'
var reg12 = /\d\d\d\d\/\d\d\/\d\d/;

13. ？ 重复出现零次或一次

var reg13 = /^https?/;
console.log('boo13', reg13.test('http://asdfasdfasdf')); // true
console.log('boo13', reg13.test('https://asdfasdfasdf')); // true

14. + 重复出现一次或多次

var reg14 = /a+/; // 有一个a或者多个a都能匹配
log('boo14', reg14.test('sdfsdfsaasdf')); // true
log('boo14', reg14.test('22222a')); // true

15. * 重复出现零次或多次

var reg15 = /^https?.*/;
log('boo15', reg15.test('http://asdfasdfsadf')); // true

16. {n} 重复出现 n 次

var reg16 = /^1\d{10}$/;

17. {n,} 至少重复出现 n 次

var reg17 = /\d{10,}/; // 至少有10个数字

18. {m,n} 重复重现 m 到 n 次，其中，m<n

var reg17 = /\d{10,20}/; // 匹配10个到20个数字

(三) 惰性匹配

尽可能少的匹配

//一整个，出现一次
var reg = /\d+/;
var str = '23423424234234234';
var arr = str.match(reg);
console.log('arr', arr);

//可以，分成多个！出现多次
var reg2 = /\d+?/;
var arr2 = str.match(reg2);
console.log('arr2', arr2);

(四) 分组

4.1 用括号分组
4.2 分组的应用

// 分组可以使用 \1-代表第一组, \2-第2组
    var dateReg1 = /^(\d{4})-(\d{2})-(\d{2})$/;
    var dateReg2 = /^(\d{4})-(\d{2})-\2$/; // \d{2} 和 \2 数字要一样
    var str = '2021-06-06';
    console.log('date1', dateReg1.test(str));
    console.log('date2', dateReg2.test(str));
    var phoneReg = /^(1\d{2})(\d{4})\2$/;
    var str = '13800000000';
    console.log('phone', phoneReg.test(str));
    // 字符串替换时,可以使用正则分组,使用$1-第1组,$2-表示第2组
    var str = '13811112222';
    var newStr = str.replace(/(\d{3})(\d{4})(\d{4})/, '$1****$3');
    console.log('newStr', newStr);