JavaScript的第十四天

目录

一、RE正则

        1. 通过调用 RegExp 对象的构造函数创建

        2、通过字面量创建

        reg.test("a") 正则对象方法，用于检测字符串是否符合该规则，该对象会返回 true 或 false，其参数是测试字符串。

二、边界符

三、字符类

        字符类: [] 表示有一系列字符可供选择，只要匹配其中一个就可以了

四、量词

        量词符: 用来设定某个模式出现的次数

        简单理解: 让a这个字符重复多少次

五、替换

        替换 replace

用户名验证案例

---

一、RE正则

        1. 通过调用 RegExp 对象的构造函数创建

        var reg1 = RegExp(/123/)
        var reg = new RegExp(/aaa/)

        2、通过字面量创建

        reg1.test("123");

        reg.test("a") 正则对象方法，用于检测字符串是否符合该规则，该对象会返回 true 或 false，其参数是测试字符串。

二、边界符

reg = /abc/	只要包含abc就可以通过
reg= /^abc/	第一个位置从谁开始且按照顺序排列
reg = /^abc$/	从abc开始到abc结束，必须完全匹配

        // 边界符 ^ $ 
        var reg = /abc/;  //只要包含abc就可以通过
        console.log(reg.test('abcd'));//true
        console.log(reg.test('bcda'));//false
        console.log(reg.test('aabcd'));//true
        console.log('-------------------------');

        // ^  从谁开始
        var reg1 = /^abc/;
        console.log(reg1.test('aabc'));//false
        console.log(reg1.test('abccc'));//true
        console.log(reg1.test('aabcdd'));//false
        console.log('-----------------------');

        var reg2 = /^abc$/;  //从abc开始到abc结束 必须完全匹配
        console.log(reg2.test('abc'));//true
        console.log(reg2.test('abcabd'));//false
        console.log(reg2.test('abcccc'));//false
        console.log(reg2.test('abcabc'));//false

三、字符类

        字符类: [] 表示有一系列字符可供选择，只要匹配其中一个就可以了

reg = /[abc]/	只要匹配其中一个就可以了
reg = /^[abc]/	开头只要匹配其中一个就可以了
reg= /[a-z]/	取值范围a-z
reg = /^[a-z]$/	给了范围a-z 26字母任意选择，但是只能匹配一个

        var reg = /[abc]/;  //只要匹配其中一个就可以了
        console.log(reg.test('aaaaaaaaaaaaa'));//true
        console.log(reg.test('b'));//true
        console.log(reg.test('c'));//true
        console.log('------------------------');

        var reg1 = /^[abc]/;  //开头只要匹配其中一个就可以了
        console.log(reg1.test('abcccccc'));//true
        console.log(reg1.test('dabcccccc'));//false
        console.log(reg1.test('faabc'));//false
        console.log('------------------------------');
        var reg2 = /[a-z]/   //取值范围a-z
        console.log(reg2.test('aa'));//true
        console.log(reg2.test('B'));//false
        console.log(reg2.test(','));//false
        console.log(reg2.test('-'));//false
        console.log('------------------');

        var reg3 = /^[a-z]$/  //给了范围a-z 26字母任意选择   给了边界符  只能匹配一个
        console.log(reg3.test('a'));//true
        console.log(reg3.test('B'));//false
        console.log(reg3.test(','));//false
        console.log(reg3.test('-'));//false
        console.log(reg3.test('ab'));//false
        console.log('-----------------');
        var reg4 = /^[a-zA-Z0-9]$/;
        console.log(reg4.test('1'));//true
        console.log(reg4.test(1));//true
        console.log(reg4.test('-'));//false
        console.log(reg4.test('B'));//true

四、量词

        量词符: 用来设定某个模式出现的次数

        简单理解: 让a这个字符重复多少次

reg = /^a*$/	重复0次或多次
reg = /^a+$/	重复1次或更多次
reg= /^a?$/	重复0次或1次
reg = /^a{3}$/	{n}  n为几就重复几次
reg = /^a{3,}$/	{n,}  n次及以上
reg = /^a{4,16}$/	{n，n}  {4-16}次

        var reg = /^a*$/  //重复0次或多次
        console.log(reg.test(''));//true
        console.log(reg.test('a'));//true
        console.log(reg.test('aaaa'));//true
        console.log(reg.test('aaaaccccaaaa'));//false
        console.log('-----------');

        var reg1 = /^a+$/  //重复1次或更多次
        console.log(reg1.test(''));//false
        console.log(reg1.test('a'));//true
        console.log(reg1.test('aa'));//true
        console.log(reg1.test('aaaaccccaaaa'));//false
        console.log('-----------');

        var reg2 = /^a?$/  //重复0次或1次
        console.log(reg2.test(''));//true
        console.log(reg2.test('a'));//true
        console.log(reg2.test('aaaaaaaaaaaa'));//false
        console.log('-----------');

        var reg3 = /^a{3}$/  //{n}  n为几就重复几次
        console.log(reg3.test(''));//false
        console.log(reg3.test('a'));//false
        console.log(reg3.test('aaa'));//true
        console.log('-----------');
        var reg4 = /^a{3,}$/  //{n,}  n次及以上
        console.log(reg4.test(''));//false
        console.log(reg4.test('a'));//false
        console.log(reg4.test('aaa'));//true
        console.log(reg4.test('aaaaaaaaaa'));//true
        console.log(reg4.test('aaaaaaaaaab'));//false
        console.log('-----------');
        var reg5 = /^a{4,16}$/  //{n}  {4-16}次
        console.log(reg5.test(''));//false
        console.log(reg5.test('a'));//false
        console.log(reg5.test('aaaaaaaaaa'));//true
        console.log(reg5.test('aaaaaaaaaaaaaaaaa'));//false
        console.log('-----------');

五、替换

        替换 replace

                g: 全局匹配

                 i: 忽略大小写

                gi: 全局匹配 + 忽略大小写

        var reg = /a|b/gi

用户名验证案例

        var reg = new RegExp(/^\w{6,16}$/)
        $(".uname").blur(function () {
            if ($(this).val()) {
                if (reg.test($(this).val())) {
                    $("span").html("输入正确")
                    $("span").css("color", "#0f0")
                } else {
                    $("span").html("输入有误")
                    $("span").css("color", "#f00")
                }
            } else {
                alert("用户名不能为空")
            }
        })