正则

161 阅读3分钟

正则概念

正则表达式:是一种用于对字符串处理表达式

作用:

1.可以约束字符串的规则。验证字符串是否符合某种规则

2.可以将字符串中满足规则部分提取出来

3.可以将字符串中满足规则部分替换成新的部分

正则其实就是这几个作用中指的 规则

正则初体验

// document.querySelector('input').onkeyup = function(e) {
//     if (e.keyCode != 13) return false
//     var content = this.value
//     // 规则:字母开头,数字字母下划线组成,4~10位
//     // 定义规则
//     var reg = /^[a-zA-Z]\w{3,9}$/
//     if (reg.test(content)) {
//         alert('ok')
//     } else {
//         alert('不ok')
//     }
// }

// let str = '嗨,小哥哥,晚上有空1起打麻将吗?有空call我,13212345645,或者来我家,368号,记住了吗?'
// var reg = /1[3-9]\d{9}/
// var tel = str.match(reg)[0]
// console.log(tel);

// let str = 'i love html and html is very good'
// var reg = /html/g
// console.log( str.replace(reg, 'js') );

正则使用

 手机号规则
var reg = /1[3-9]\d{9}/

// 验证字符串
// 语法:
// 正则表达式.test(字符串) - 返回布尔值
// 判断字符串中是否包含了正则规则
var str = 'jkasdh13212312312fkjashdf'

// var bool = reg.test(str)
// console.log(bool);

// 语法:
// 字符串.search(正则表达式) - 返回下标或-1
// 从字符串中找符合规则部分,找到了就返回下标,找不到返回-1
// var index = str.search(reg)
// console.log(index);

// 提取字符串
// 语法:
/*
    正则表达式.exec(字符串) - 返回数组
    将符合规则部分,放在一个数组中
*/
// var arr = reg.exec(str)
// console.log(arr);


// 语法:
// 字符串.match(正则表达式) - 返回数组
// 将符合规则部分,放在一个数组中
// var arr = str.match(reg)
// console.log(arr);


// 替换字符串
// 字符串.replace(正则表达式, 新内容) - 将字符串中符合规则的部分替换成新内容,返回替换后的新字符串
// console.log( str.replace(reg, '*'.repeat(11)) );


// 3个字符串方法:
/*
字符串.match(正则)
字符串.search(正则)
字符串.replace()
*/
// 2个正则方法:
/*
正则.test()
正则.exec()

正则的定义

字面量定义方法 - 从字面上就可以看出数据的类型了

var reg = /具体的规则/
*/
// var reg = /abc/
// console.log(reg);
// console.log(typeof reg);
// console.dir(reg)

构造函数方法:

/*
var reg = new RegExp('具体规则')
*/
// var reg = new RegExp('abc')
// console.log(reg);

任意数据都有两种定义方式,分别是字面量方式和构造函数方式

// var obj = {}
// var obj = new Object()

// var arr = []
// var arr = new Array()

// var n = 10
// var n = new Number(10)
// n++
// console.log(n);

// var str = ''
// var str = new String('abcde')
// str += 'abc'
// console.log(str);

// var fn = function() {}
// function fn() {}
// var fn = new Function()
// console.log(fn);

因为在js底层(内部),在处理任意数据的时候,都是使用对象在处理 为了方便开发者识别不同的数据,进行不同的操作,所以提供了一些基本类型

// var str = 'abcd'
// // console.log(str);
// // 对象才有   对象.xxx  的语法,所以能理解  字符串在js内部确实是对象
// var s = str.slice(0, 2)
// console.log(s);

正则组成

具体规则的组成部分:

// var reg = /具体规则/

1.字符 - 用来匹配某些字符串字符的

普通字符 - 用一个普通的字符代表字符串中的字符,匹配 abc 直接写abc

元字符 - 特殊字符,带有特殊含义,使用特殊字符代表某些字符 \d \w ...

2.修饰符 - 用来修饰字符 出现多少次,开头,结尾 修饰次数

开头

结尾

或者

单元

取反

忽略大小写

贪婪

...

字符

普通字符

var reg = /abc/ // 表示我们的规则:带有字符a
// var str = 'asdfasfdabc'
// console.log( reg.test(str) );

元字符 - 有特殊含义的字符

\d 代表一个任意数字
\w 代表一个 任意 数字、字母、下划线
\s 代表一个空格
.  代表一个任意字符
\D 非\d的意思,代表一个非数字
\W 非\w的意思,代表一个非数字字母下划线
\S 非\s的意思,代表一个非空格
var reg = /\d/ // 意思:包含1个数字
// var str = 'a0123456asdfasdfbcd'
// console.log( reg.test(str) );
var reg = /\w/ // 意思:包含1个 任意的数字或字母或下划线
// var str = '!@asdfkjlkjahsdf$%^'
// console.log(reg.test(str));
var reg = /\s/
// var str = 'aasjdfhakjsdhfka'
// console.log(reg.test(str));
var reg = /./
// var str = '@'
// console.log( reg.test(str) );

修饰字符次数

修饰字符出现几次的修饰符:

  • 代表前面的字符需要最少1次
  • ? 代表前面的字符最多1次
  • 代表前面的字符可以是任意次
  • {n} 代表前面的字符必须是n次
  • {n,} 代表前面的字符最少是n次
  • {n,m} 代表前面的字符最少是n次,最多是m次
ar reg = /\d+/ // 意思:最少1个数字
// var str = 'abc123def'
// console.log( str.match(reg) );
var reg = /\d?/ // 字符串中是否包含  最多1个数字,没有数字也可以
// var str = 'asdjkfhk'
// console.log( reg.test(str) );
var reg = /\d*/ // 意思:字符串中是否包含 任意个数字
// var str = 'abc123def'
// console.log( str.match(reg) );
var reg = /\d{2}/ // 意思:字符串中是否包含了 连续的两个数字 等同于 /\d\d/ 
// var str = 'asjdfhk69789jas'
// console.log( reg.test(str) );
/ var reg = /\d{2,}/ // 意思:包含了最少2个数字
// var str = 'asjdfhk6jas'
// console.log( str.match(reg) );
 var reg = /\d{2,5}/ // 意思:包含了最少2个数字,最多5次
// var str = 'asjdfhk62333999jas'
// console.log( str.match(reg) );

其他修饰符

1,开头的修饰符 ^:修饰字符串必须以他后面的字符开头 - 通常这个符号放在具体规则的最前面

2,结尾修饰符 $:修饰字符串必须以他前面的字符结尾 - 通常这个符号放在具体规则的末尾

var reg = /^\d+/ // 字符串必须以\d开头
// var str = 'bbb123abc'
// console.log( reg.test(str) );
var reg = /\d$/ // 字符串必须以\d结尾
// var str = 'abc234d5'
// console.log( reg.test(str) );
[] 修饰其中的字符,整个中括号代表一个字符,是其中的任意一个
// var reg = /[abc]/ // 一个字符,a或b或c
// var str = 'ddwerd'
// console.log( reg.test(str) );
 | 在正则表示或者的意思
// var reg = /a|b|c/ // 等同于[abc]
// var str = 'ddwecrd'
// console.log( reg.test(str) );
() 这是一个单元(整体)
// var reg = /ab|cd/ // ab | c    ab | cd    a b|c d   a b|cd   有歧义
// 所以加括号来表示
// var reg = /\d(ab|cd)/ // ab或cd
// var reg = /(ab|c)d/ // ab或c    abd或者cd
// var reg = /a(b|c)d/ // b或c      abd或acd
// var reg = /a(b|cd)/ // b或cd    ab或acd
var str = '5abcd'
// console.log( str.match(reg) );
忽略大小写
// i   放在两个斜杠后面
// var reg = /a/i // 字符串是否包含aA
// var str = 'A'
// console.log( str.match(reg) );

正则表达式正常是不贪婪的

g 开启贪婪模式

案例:

// 网易邮箱的规则
// 规则:字母开头,数字字母下划线组成,6~18位
// - 表示 到 的意思 3-6
// \ 表示转义
// var reg = /^[a-zA-Z]\w{5,17}@(163|126)\.com$/
// var str = 'zhaotianyin1@163.com'
// console.log( reg.test(str) );
// qq号规则
// 规则:不能用0开头,5~10位任意数字
// var reg = /^[1-9]\d{4,9}$/
// var reg = /^[1-9]\d{4,9}@qq\.com$/
/ 手机号正则
// 规则:1开头,第二个数字3-9,其余9个数字是任意的
// var reg = /^1[3-9]\d{9}$/
// 提取字符串中所有的中文姓名
// var str = "张三:1000,李四:50000,王五:800。";
// [\u4e00-\u9fa5] 任意一个汉字
// var reg = /[\u4e00-\u9fa5]{2,}/g
// console.log( str.match(reg) );
// console.log( reg.exec(str) );
// console.log( reg.exec(str) );
// console.log( reg.exec(str) );
// console.log( reg.exec(str) );
^ 放在[]中就表示取反的意思
// var reg = /[^ab]/ // 非a和b
// var str = 'ab4'
// console.log(reg.exec(str));