在js中使用正则表达式

  在我们设计网页时,总会与表单打交道,而对表单的验证大部分则是由正则表达式来进行验证的。首页我们来了解一下什么是正则表达式:

(上图来源于百度百科)正则表达式_百度百科

  接下来我们来了解一下正则表达式的简答使用:

  1.我们先通过字面量创建一个新的正则表达式(正则表达式的格式为/*/ *为正则表达式的内容 正则表达式里内容不需要加引号 不论是数字型还是字符串型)

  

var rg =/123/;

   2.接着我们通过正则表达式的test方法来检测字符串是否符合正则表达式要求的规范(正则表达式的返回值为布尔类型)

  

console.log(rg.test(123));
console.log(rg.test('abc'));

  下图为控制台中打印的结果

    

  3.接下来介绍正则表达式中的边界符

  下图为不加边界符的正则表达式以及在控制台中打印的结果

var rg = /abc/;
console.log(rg.test('abc'));
console.log(rg.test('abcd'));
console.log(rg.test('aabcd'));

下图为只加了起始边界符的正则表达式以及在控制台中打印的结果(起始边界符的符号位^)

var reg = /^abc/;
 console.log(reg.test('abc'));
 console.log(reg.test('abcd'));
 console.log(reg.test('aabcd'));

 下图为加了起始边界符号以及结束边界符的正则表达式以及在控制台中打印的结果(结束边界符的符号为$)

var reg1 =/^abc$/;
console.log(reg1.test('abc')); 
console.log(reg1.test('abcd')); 
console.log(reg1.test('aabcd'));
console.log(reg1.test('abcabc'));

  4.接下来介绍正则表达式中的字符集合

  []表示有一系列字符可供选择,只要匹配其中一个就行了

   var rg = /[abc]/; // 只要包含有a 或者 包含有b 或者包含有c 都返回为true
   console.log(rg.test('andy')); //true
   console.log(rg.test('bady')); //true
   console.log(rg.test('color')); //true
   console.log(rg.test('red')); //false

边界符需要写到字符集合外面

var rg1 =/^[abc]$/;//三选一 只有是a 或者是b 或者是c 这三个字母才返回true
        console.log(rg1.test('aa')); //false
        console.log(rg1.test('a')); //true
        console.log(rg1.test('b')); //true
        console.log(rg1.test('c')); //true
        console.log(rg1.test('abc')); //false

        var reg = /^[a-z]$/; //26个英文字母任何一个字母返回true -表示的是a到z的范围
        console.log(reg.test('a')); //true
        console.log(reg.test('z')); //true
        console.log(reg.test('1')); //false
        console.log(reg.test('A')); //false

下面介绍的是字符组合

 var reg1 =/^[a-zA-Z0-9_-]$/; //26个英文字母(大写和小写都可以)任何一个字母返回true
        //0-9的任何一个数字返回true -表示的是a-z的范围以及0-9的范围
        console.log(reg1.test('a'));
        console.log(reg1.test('B'));
        console.log(reg1.test(9));
        console.log(reg1.test('_'));
        console.log(reg1.test('-'));
        console.log(reg1.test('!'));

 ^符号写到字符集合内表示取反 意思就是除了大小写字母,0-9的数字以及下划线中划线以外的符号都返回为true

        var reg2 = /^[^a-zA-Z0-9_-]$/;
        console.log(reg2.test('a'));
        console.log(reg2.test('B'));
        console.log(reg2.test(9));
        console.log(reg2.test('_'));
        console.log(reg2.test('-'));
        console.log(reg2.test('!'));

  5.接下俩介绍正则表达式中的量词符

 //量词符:用来设定某个模式出现的次数
        //简单理解:就是让下面的a这个字符重复多少次
        var reg =/^a$/;

        // * 相当于>=0 可以出现0次或者很多次
         var reg =/^a*$/;
         console.log(reg.test('a')); //true
         console.log(reg.test('')); //true
         console.log(reg.test('aaaa')); //true

        // + 相当于>=1 可以出现1次或者很多次
         var reg =/^a+$/;
         console.log(reg.test('a')); //true
         console.log(reg.test('')); //false
         console.log(reg.test('aaaa')); //true

        // ? 相当于 1||0 只能出现1次或0次
         var reg =/^a?$/;
         console.log(reg.test('a')); //true
         console.log(reg.test('')); //true
         console.log(reg.test('aaaa')); //false

        // {3}就是重复三次
         var reg =/^a{3}$/;
         console.log(reg.test('a')); //false
         console.log(reg.test('')); //false
         console.log(reg.test('aaaa')); //false
         console.log(reg.test('aaa'));//true

        // {3,} 大于等于3
         var reg=/^a{3,}$/;
         console.log(reg.test('a')); //false
         console.log(reg.test('')); //false
         console.log(reg.test('aaaa')); //true
         console.log(reg.test('aaa'));//true

        // {3,16} 大于等于3 并且 小于等于16
        var reg =/^a{3,6}$/;
        console.log(reg.test('a')); //false
        console.log(reg.test('')); //false
        console.log(reg.test('aaaa')); //true
        console.log(reg.test('aaa'));//true
        console.log(reg.test('aaaaaaa'));//false

  以上就是正则表达式的简单介绍 

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值