my正则表达式

知识点

• 正则表达式的作用：匹配字符串的
• 在大多数编程语言中都可以使用
• 正则表达式的组成：是由元字符或者限定符组成的一个式子

元字符:

"." :表示的是：除了\n以外的任意字符
"[]":表示的是：范围
"|" :或者
"()":分组
"*"	:表示的是：前面的表达式出现了0次到多次
"+"	:标识的是：前面的表达式出现了1次到多次
"?" :表示的是：前面的表达式出现了0次到1次

限定符"{}"：限定前面的表达式出现的次数
{0,} 表达的是前面的表达式出现了0次到多次，和 *一样
{1,} 表达的是前面的表达式出现了1次到多次，和 +一样
{0,1} 表达的是前面的表达式出现了0次到1次，和 ？一样
{start,end},表示start次到end次

注意："{,10}"  错误的写法===不能这样写

"^":表达的是以什么开始，或取反
"$":表示的是以什么结束

"\d":数字中的任意一个,相当于[0-9]
"\D":非数字中任意一个,相当于[^0-9]
"\s":空白符中任意一个
"\S":非空字符任意一个
"\w":非特殊字符
"\W":特殊符号
"\b":单词的边界,指单词和空格间的那个位置

正则表达式中
- i:表示的是忽略大小写
- g:表示的是全局模式,全文搜索
- m:多行查找

创建正则表达式

两种方法
 1. 通过构造函数创建对象
 2. 字面量的方式创建对象

//对象创建
var reg=new RegExp(/\d{5}/);// 是否有五个连续数字
var str="我的电话是1234321234";
//调用方法验证字符串是否匹配
var flag=reg.test(str);
console.log(flag); // true
//字面量的方式创建正则表达式对象
var re=/\d{1,5}/;
re.test("小李的幸运数字是：666");
console.log(/\d{1,5}/.test("小李的幸运数字是：666"));// true


// match()的使用
var str = "中国移动：12334广泛的43212空间的发生过43211";
var arr = str.match(/\d{5}/g); // g多个字符串
console.log(arr);// (3) ["12334", "43212", "43211"]

// replace()的使用
var str = "HhppsPPHhh";
console.log(str);// HhppsPPHhh
var str = str.replace(/[h]/gi, "WS");
console.log(str);// WSWSppsPPWSWSWS

stringObj.replace(regexp/substr,replacement)；
参数类型：
1. 两个参数都是字符串
2. 第一个参数是正则，第二个参数是字符串
3. 第一个参数是正则，第二个参数是带$符的字符串
	$n表示,在正则匹配到的字符串中，第n个正则匹配到的数据元素
4. 第一个参数是正则，第二个参数函数
5. 第一个参数是正则且有子表达式，第二个参数函数且带有多个参数
	var str5 = '这是一段原始文本，需要替换的内容"3c这要替换4d"！';
    var newStr = str5.replace(/([0-9])([a-z])/g, function(arg1, arg2, arg3, arg4, arg5) {
        console.log(arg1);
        console.log(arg2);
        console.log(arg3);
        console.log(arg4);
        console.log(arg5);
    });
    arg1表示匹配的整体.
    arg2表示第一个子表达式.
    arg3表示第二个子表达式.
    arg4是一个整数，声明了表示子匹配在 stringObject 中出现的位置.
    arg5是 stringObject 本身.

实际用例

身份证的正则表达式：
// 15位或者18位
([1-9][0-9]{14})|([1-9][0-9]{16}[0-9xX])

([1-9][0-9]{14})([0-9]{2}[0-9xX])?

邮箱的正则表达式：
[0-9a-zA-Z_.-]+[@][0-9a-zA-Z_.-]+([.][a-zA-Z]+){1,2}

qq的正则表达式:
^\d{5,11}

姓名的正则表达式:
^[\u4e00-\u9fa5]$

案例应用-密码强度

html部分

<div class="container text-center ">
        <form action="">
            <div class="input-group">
                <lable class="input-group-addon" for="password">密 码：</lable><input id="password" type="text" class="text-danger form-control"></div>
            <div class="input-group">
                <span class="input-group-addon">密码强度：</span>
                <div id="strengthLevel" class="strengthLv0"></div>
            </div>
        </form>
    </div>

css部分

.strengthLv0 {height: 30px;border: 1px solid #ccc;padding: 2px;}
.strengthLv1 {background-color: red;height: 30px;width: 33.33%;border: 1px solid #ccc;padding: 2px;}
.strengthLv2 {background-color: orange;height: 30px;width: 66.66%;border: 1px solid #ccc;padding: 2px;}
.strengthLv3 {background-color: green;height: 30px;width: 100%;border: 1px solid #ccc;padding: 2px;}

javascript部分

function my$(id) {
    return document.getElementById(id);
}
my$('password').onkeyup = function() {
    var lvl = this.value.length >= 6 ? getLvl(this.value) : !this.value.length ? 0 : 1;
    switch (lvl) {
        case 1:
            my$('strengthLevel').className = 'strengthLv1';
            break;
        case 2:
            my$('strengthLevel').className = 'strengthLv2';
            break;
        case 3:
            my$('strengthLevel').className = 'strengthLv3';
            break;
        case 0:
            my$('strengthLevel').className = 'strengthLv0';
            break;
    }
}
var getLvl = function(pwd) {
    var lv = 0;
    if (/\d+/.test(pwd)) {
        lv++;
    }
    if (/[a-zA-Z]+/.test(pwd)) {
        lv++;
    }
    if (/\W/.test(pwd)) {
        lv++;
    }
    return lv;
}

import re
re.rearch(reg,string)
re.group()
re.split(reg,string)