有学有练才叫学习:学而不思则罔,思而不学则殆:学而不习,纸上谈兵,习而不进,画地为牢!

js 正则表达式语法大全【完整版】

javascript cat 10个月前 (11-25) 27次浏览 已收录 0个评论 扫描二维码

正则表达式

事先定义好的一些特殊字符,及这些特定字符的组合,组成一个‘规则字符串’,这个字符串就是正则。

正则是操作字符串

RegExp:正则(regular) 表达式(expression)

1、写法

字面量创建: /检索字符/修饰符;

构造函数创建:new RegExp('检索字符', '修饰符');

// 1、字面量
// /检索字符/修饰符
var re = /abc/;
console.log(re); // /abc/
console.log(typeof re); // 'object'

// 2、构造函数(如果有变量,就必须用构造函数创建,不能用字面量创建)
// new RegExp('检索字符', '修饰符')
var re = new RegExp('abc');
console.log(re); // /abc/
console.log(typeof re); // 'object'

// 使用变量
var ddd = 'abc';
var re = new RegExp(ddd);
console.log(re);

2、修饰符

var str = '今天上课,明天上课,后天上课';

// 正则默认只匹配成功一次,就会停止,如果想多次匹配,则加上标识符g
var re1 = /上课/;
var re2 = /上课/g; // 全局匹配
var re3 = new RegExp('上课', 'g');

console.log(str.replace(re1, '休息')); // 今天休息,明天上课,后天上课
console.log(str.replace(re2, '休息')); // 今天休息,明天休息,后天休息
console.log(str.replace(re3, '休息')); // 今天休息,明天休息,后天休息

// 正则默认区分大小写,如果想要不区分大小写,则加标识符i

var str = 'abCd';
var re1 = /abcd/;
var re2 = /abcd/ig;
var re3 = new RegExp('abcd', 'ig');

console.log(re1.test(str)); // false
console.log(re2.test(str)); // true

3、正则的方法

1、test
// 正则.test(字符串)     常用
// 检索字符串中是否包含正则要检索的内容,有则返回 true,没有则返回 false

var str = "hello world";
var re = /o/;
console.log(re.test(str)); // true
2、exec
// 正则.exec(字符串)      了解
// 检索到正则表达式规定的内容会返回一个数组,检索不到则返回 null
// 同match

var str = "hello world";

var re = /o/;
var re1 = /z/;

console.log(re.exec(str)); // [ "o" ]
console.log(re1.exec(str)); // null
3、match
// 字符串.match(正则)
// 正则去匹配字符串,如果匹配成功,就返回匹配成功的数组,如果匹配不成功,就返回null,跟exec方法一样

var str = "hello world";
var re = /o/g;
console.log(str.match(re)); // [ "o", "o" ]

var str = 'haj123sdk54hask33dkhalsd879';
var re = /\d+/g;
console.log(str.match(re)); // ["123", "54", "33", "879"]
4、split
// 字符串.split(正则);
// 按正则匹配的内容拆分成数组

var str = 'hello web';
console.log(str.split(' '));
console.log(str.split(/\s/));

// | :正则中的或者

var str = '2023-12-12 10:10:10'; // [2023,12,12,10,10,10]
var re = /\s|-|:/;
console.log(str.split(re)); // ["2023", "12", "12", "10", "10", "10"]
5、replace
// 字符串.replace(正则, 替换的新字符);
// 作用:替换正则匹配的字符串,返回的结果是替换以后的字符串,不影响原字符串

// replace的第二个参数可以是一个字符串,也可以是一个函数,函数的第一个参数就是正则匹配成功的整体,第二个参数就是正则的第一个小括号,以此类推

var str = '今天上课,明天上课,后天上课';
var re = /上课/g;

// console.log(str.replace(re, '休息')); // 今天休息,明天休息,后天休息

var s = str.replace(re, function ($0) {
    console.log($0);
    return '休息';
})
console.log(s);
6、search
// 字符串.search(正则);
// 返回正则匹配到的第一个字符串的位置,没有返回-1,类似于indexOf

var str = 'hello world';

var re1 = /o/;
var re2 = /z/;
console.log(str.search(re1)); // 4
console.log(str.search(re2)); // -1

4、其它

1、转义字符

这个字符有它本来和意思,加上反斜扛,就成了其它的意思。

\d	匹配数字
\D	匹配非数字
\w	匹配字母和数字及_
\W	匹配非字母和数字及_
\s	匹配空白字符、空格、制表符和换行符
\S	匹配非空白字符
2、量词
{4,7}  : 最少出现4次,最多出现7次
{4,} : 最少出现4次,最多不限制
{4} : 正好出现4次
{1,} : 最少出现一次。简写为:+
{0,}  : 至少出现0次。简写为:*
{0,1}  : 出现0次或者1次。简写为:?
+和*的区别:+代表必须有,*代表可以没有。
3、或者 : |
var re = /\s|-|:/; // 以空格  或者以-  或者以:
4、分组(小括号)
var re = /(\d{3})(\d{4})(\d{4})/; // 小括号是分组
5、点
// .     匹配除换行符外的任意字符

var str = 'hello wrold';
var re = /h.*o/;
console.log(str.match(re));

// \.    代表真正的点
var str1 = 'abcd.html';
var str2 = 'abcdehtml';

var re = /\.html/;
console.log(re.test(str1)); // true
console.log(re.test(str2)); // false
6、正则中的中括号及排除

字符类:即一对中括号代表一个字符

// 中括号的作用:字符类
// 一个中括号代表一个字符,不论你里面写多少东西,它总之是一个字符

var str = 'abc';

var re = /a[abcd]c/; // aac abc acc adc
console.log(re.test(str)); // true

var re = /[a-zA-Z0-9]/; // 大小写字母及数字
var re = /[d-e]/;// 可以a-f d-e,但不能反着来

var str = 'abc';

// ^写在中括号里面,即排除中括号里面的内容
var re = /a[^abcd]c/; // 排除a b c d,其它的都可以
console.log(re.test(str)); // false
7、起始和结束
<input type="text">
<button>验证手机号</button>
<hr>
<input type="text">
<button>验证qq号</button>

<script>
    var input = document.querySelectorAll('input');
    var btn = document.querySelectorAll('button');

    btn[0].onclick = function () {
        var val = input[0].value; // 用户输入的手机号
        var re = /^1\d{10}$/;

        if (re.test(val)) {
            alert('是手机号')
        } else {
            alert('不是手机号')
        }

    }

    btn[1].onclick = function () {
        var val = input[1].value; // 用户输入的qq号
        var re = /^[1-9]\d{5,9}$/;

        if (re.test(val)) {
            alert('是qq号')
        } else {
            alert('不是qq号')
        }
    }
</script>
8、去除字符串左右空格
var str = '    平头  哥    ';

console.log('(' + str + ')');
console.log('(' + str.trim() + ')'); // IE8及以下不支持

// 正则解决原理
var re = /^\s+|\s+$/g;
var s = str.replace(re, '');
console.log('(' + s + ')');

// 封装方法
function trim(str) {
    var re = /^\s+|\s+$/g;
    return str.replace(re, '');
}
console.log('(' + trim(str) + ')');
9、正则相关实例
// 邮编
var re = /^\d{6}$/;

// 匹配中文
var str = 'fdssd小sfsdfddsfdsafsdsf芳ds约fdsfdsa不fds';
var re = /[\u4e00-\u9fa5]/g; // 有事一00,有酒罚我
console.log(str.match(re).join(''));

// 电子邮箱
var str = '23432432@qq.com.cn';
var str = 'sdf@163.com';
var re = /^\w+@[a-z0-9]+(\.[a-z]+){1,3}$/;

// 网址
// https://www.baidu.com
var re = /^[a-zA-Z]+:\/\/[^\s]+$/;

// 身份证号
var re = /[1-9]\d{14}|[1-9]\d{17}|[1-9]\d{16}x/;

// 电话号码
var re = /^0\d{2,3}-[1-9]\d{6,7}$/;
喜欢 (0)
cat
关于作者:
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址