JavaScript正则应用（基础）

最新推荐文章于 2024-04-26 16:38:18 发布

Little_ChenH

最新推荐文章于 2024-04-26 16:38:18 发布

阅读量220

点赞数

分类专栏： JavaScript 正则表达式文章标签：正则基础 JavaScript 字符串匹配查询操作

本文链接：https://blog.csdn.net/Little_ChenH/article/details/79137098

版权

JavaScript 同时被 2 个专栏收录

10 篇文章 0 订阅

订阅专栏

正则表达式

1 篇文章 0 订阅

订阅专栏

正则表达式概念

正则表达式，又称规则表达式。（英语：Regular Expression，在代码中常简写为regex、regexp或RE），计算机科学的一个概念。正则表通常被用来检索、替换那些符合某个模式(规则)的文本。

正则表达式是跟具体语言（比如JavaScript）无关的。因为正则表达式是用来处理字符串问题的，基本上每门语言都有字符串类型，那么也都会支持正则表达式的。正则表达式是分流派的，也跟实现引擎有关。而JavaScript用到的正则表达式的语法，是市面常见语言都支持的核心子集。

基本语法

1 表达式形式：

var reg = / pattern / flags;

2 JavaScript 写法：

字面量表达式：/正则的规则/标识符
通过构造函数生成：new RegExp()

var str = "好像sdaa324上飞机大13"；
var reg = /13/;   //字面量表达式
//或者var reg = new RegExp("13")   构造函数
alert(reg.test(str))//弹出true

3 JavaScript应用：

reg.test(str)返回一个布尔值
string.match(正则规则)返回一个类数组。
- 上方法匹配返回的类数组，拥有index（匹配在字符串中的索引）、input（母字符串）属性。在加g全局匹配后属性消失。
string.replace(正则规则，替换的字符串或者函数)字符串替换
函数要返回一个字符串,接受三个参数：1.匹配的内容。 2.下标。 3.源字符串
JS中match/test/replace/exec用法有以上这几种方式的详细讲解！

var str = "121241xx1231241xx1231"
var reg = /xx/g;
str.replace(reg,"替换")   //字符串变为=》121241替换1231241替换1231
str.replace(reg,function(a,b,c){
    console.log(a,b,c)   
    //xx   0   121241xx1231241xx1231
    //xx   15  121241xx1231241xx1231
})

正则核心

正则表达式是由两个/符号包裹起来的，两个/里面的（上面的pattern）就是需要的任何简单或者是复杂的正则表达式。而在第二个/后面是一个或者是多个标志（flags），用来标明正则表达式的行为。

flags：标识符有以下五种行为：

g：表示全局（global）模式，即在匹配到第一个后继续匹配
i：忽略（ignore）大小写
m：便是多行（multiline）模式，即到达一行时继续查找下一行
y：(ES6新增的粘连修饰符)也是全局匹配，不过第二次会接着上一次匹配停止的地方开始。
u：(ES6新增)

replace()经典用法！

var str = "first 第二部分"
var reg = /(\w+)\s(第二部分)/g
console.log(str.replace(reg,"$2 $1"))  //$2 $1代表正则的子集， 互换位置即可实现两者互换！

基础规则

元字符

转义符号\
可转义特殊符号区别于普通字符的意义。
常用特殊字符：
- .匹配除了换行以外其他所有字符！
- \n换行
- \rtab制表符
- \d数字0-9
- \D非数字
- \s空格
- \S非空格
- \w字符(数字、字母、_ )
- \W非字符(与\w互补)
- \b独立部分（单词边界：起始结束连词符）
- \B非独立部分
量词，一般由{}包裹
- {0,n}出现0-n次
- {0，1}有或者没有，可简写为？
- {0，}0-正无穷，简写为*
- {1，}1-正无穷，简写为+
- 贪婪匹配：
  1. 默认量词取能匹配的最大值！
- 非贪婪匹配
  1. {}？量词取能匹配的最小值！
标识符：
- g全局匹配
- i忽略大小写
- m多行匹配
- yes6新增粘连修饰符
- ues6新增
起始符、结束符
- ^规定以特定字符开头
- $规定以特定字符结尾
子集：()
被括号括起来部分将的当做一个整体进行量词处理后，匹配！
例如：

var str = "ababbabbb";
var reg = /ab+/gi;   //匹配（1-无穷）个b
console.log(str.match(reg))  //ab  abb  abbb

var reg1 = /(ab)+/gi;  //匹配（1-无穷）个ab
console.log(str.match(reg1))  //abab ab

遇到多层嵌套子集时，先匹配外层，再匹配内层！

范围词：
1. []
  - 如[a-z]表示范围在小写字母的任意字符
  - [A-Za-z0-9]表示范围在大小写字母或者数字中的任意字符
2. 汉字匹配范围：[\u4e00-\u9fa5]
3. [^1]取反，即匹配不是1的字符！

var str = "12"
var reg = /[^1|2/g
console.log(str.match(reg))  //2

常见字符串正则匹配

`/(\w)\1+/g` 其中：`\1`代表第一个子集，如果不加，将匹配整个字符串！

var str = "aaabbbcccdddfffwwwqqqq"
var reg = /(\w)\1+/g  
console.log(str.match(reg))
// [aaa,bbb,ccc,ddd,fff,www,qqqq]

取最长子串

var str = "aaabbbbbbcccc"
var reg = /(\w)\1+/g;
var obj,num;
var leng =0;
while((obj=reg.exec(str)) !=null){
    if(obj[0].length>leng){
        leng = obj[0].length;
        num = obj[0]
    }
}
console.log(num)// bbbbbb

或者

var str = "aaabbbbbbcccc"
var reg = /(\w)\1+/g;
var arr= str.match(reg);
var leng = 0
var num;
for(var i=0;i<arr.length;i++){
    if(arr[i].length>leng){
        leng = arr[i].length;
        num =arr[i]
    }
}
console.log(num)//bbbbbb

字符串模板，对接json数据

var dic = {
    name:"chenqian",
    age:21,
    gfriend:1
}
var str = "大家好，我叫&name&，今年&age&，我有&gfriend&个女朋友，哈哈！"
var reg = /\&(\w+)\&/g;
str = str.replace(reg, function(match,$1){
    console.log($1)//name age gfriend
    return dic[$1];
})
console.log(str) //大家好，我叫chenqian，今年21，我有1个女朋友，哈哈！

敏感词过滤

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="Author" content="">
    <title>敏感词替换</title>
    <style>
        *{margin:0;padding:0;font-family: Microsoft YaHei,serif;}
        li{list-style: none;}
        span{
            display: block;
        }
        .time{
            color:#888;
        }
    </style>
</head>
<body>
    <input type="text" id="txt">
    <button>发送</button>
    <ul>
        <!--<li><span class="time">2017-11-27 21:48</span>
            <span>卧槽</span>
        </li>-->
    </ul>
    <script>
        var Txt = document.getElementById("txt"),
            send = document.getElementsByTagName("button")[0],
            ul = document.getElementsByTagName("ul")[0],
            reg = /傻逼|我操|操|操你妈|你妈|我日|日/g;

        send.onclick=function () {
            var val = Txt.value;
            if(val){
                val = val.replace(reg,function (match) {
                    console.log(match)
                    var str = "";
                    for(var i=0;i<match.length;i++){
                        str += "*";
                    }
                    return str;
                })
                //获取时间
                var date = new Date(),
                    hh = addZero(date.getHours()),
                    mm = addZero(date.getMinutes()),
                    ss = addZero(date.getSeconds());

                var time = hh + ":" + mm + ":"+ss;

                ul.innerHTML += "<li><span class='time'>"+time+"</span><span>"+val+"</span></li>"

            }
        }
        function addZero(n) {
            return n<10?"0"+n:""+n;
        }
    </script>
</body>
</html>

登录验证、号码、qq号等…

var reg = {
    tel:/^1[1-3]\d{9}$/, 
    qq:/^[1-9]\d{4,10}$/,
    id:/^^[1-9]\d{5}$/,
    url : /^(http|https):\/\/[\S]*$/,
    email : /^[1-9A-Za-z]\w{5,19}@[1-9a-z]{2,7}\.[a-z]{2,5}$/,
    user : /^[1-9a-zA-Z_]\w{5,19}$/,
    pwd : /^[\w!@#$%^&*()_+\-=/{}\[\]:";',.\/]{6,20}$/
}

Little_ChenH

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript正则应用（基础）

正则表达式概念正则表达式，又称规则表达式。（英语：Regular Expression，在代码中常简写为regex、regexp或RE），计算机科学的一个概念。正则表通常被用来检索、替换那些符合某个模式(规则)的文本。正则表达式是跟具体语言（比如JavaScript）无关的。因为正则表达式是用来处理字符串问题的，基本上每门语言都有字符串类型，那么也都会支持正则表达式的。正则表达式是
复制链接

扫一扫