正则
一、正则基础使用
1.1 字符串扩展方法
let str = "\u4e00";
console.log(str);
// let str="abcde";
// 判断字符串中是否有该字符,返回true或者false
// console.log(str.includes("c"));
// 判断字符串中是否该字符在头部,返回true或者false
// console.log(str.startsWith("ab"));
// 判断字符串中是否该字符在尾部,返回true或者false
// console.log(str.endsWith("de"));
// 将字符重复多少次返回
// console.log(str.repeat(3));
// let a=Math.floor(Math.random()*1000).toString();
// 判断该字符串的长度是否是几位,如果不足几位在前面补足前导字符
// a=a.padStart(3,"0");
// 判断该字符串的长度是否是几位,如果不足几位在后面补足字符
// a=a.padEnd(3,"0");
// console.log(a);
// let age=30;
// let a="今年张明"+age+"岁";
// let b=`今年张明${age}岁了`;
// console.log(b);
// let div=document.querySelector("div");
// let str1=`<ul>`;
// for(let i=0;i<10;i++){
// str1+=`<li class="li0">${i}</li>`;
// }
// str1+=`</ul>`;
// div.innerHTML=str1;
// let li=document.querySelectorAll(".li0");
// console.log(li);
// let div=ce("div");
//
// function ce(type) {
// return document.createElement(type);
// }
// alert `你好`;
//
// function fn(a) {
// console.log(a);
// }
//
// fn `3`;//字符串
// function fn(a,b,c,...arg) {
// // ...arg是传入后续的所有内容组成的数组
// console.log(a,b,c,arg);
// }
// fn(3,4,5,6,7,8,9)
1.2 正则表达式
//构造函数创建
// var reg=new RegExp("a","修饰符")
// /正则内容/修饰符
// var reg=/a/i;
// 修饰符
// i 不区分大小写
// g 全局匹配
// m 多行匹配
// var str="abcdafabf";
// str=str.replace( /a/g,"0");
// console.log(str);
/*
* 正则表达式.test(字符串)
* 判断字符串中有没有符合正则表达式需求的内容,返回布尔值
*
* 正则表达式.exec(字符串)
* 判断字符串中符合正则表达式的内容,生成一个数组
* 仅能找到第一个符合条件内容,index就是找到的下标
*
* */
// var reg=/a/i;
// var bool=reg.test("abcde");
// var bool=reg.test("bAcde");
// var bool=reg.test("becde");
// console.log(bool);
// var reg=/a/g;
// var obj=reg.exec("bacdea");
// console.log(obj);
/*
* replace 替换
* match 查找 查找正则匹配,并且返回被查找到元素,
* 如果仅查到一个,和正则exec方法相同
* 如果查找到多个,就会返回一个数组,返回被查到的元素,但是不返回下标
* search 查找 查找正则匹配,并且返回第一个被查找到的下标,一般不用全局匹配
* split 切割成数组
*
*
*
*
* */
var str="abcade";
// console.log(str.match(/a/));
// console.log(str.search(/a/g));
// console.log(str.split(/[bd]/g));
// B
// str=str.replace(/a/g,function (item,index) {
//// console.log(item,index);
//// return "0"
// if(index===0) return "$";
// return "&";
// });
// console.log(str);
1.3 元字符
// console.log("abcde".match(/bcd/));//按照顺序依次匹配,完全匹配后返回
// console.log("bcbdbe".match(/bd/g));
/*
* . 可以匹配任意一个字符
* \. 将.这个通配符转换字符.的含义
* \字符 转义字符 转变原来的含义
*
* */
// console.log("bcbdbe".match(/b./g));
// console.log("bcb.be".match(/b\./g));
// console.log("bc\\b.be".match(/b\./g));
//
// console.log("bc\\b.be".match(/c\\/))
// /^(?=\D\d)(?=.*[a-z])(?=.*[A-Z])\w{8,16}$/
/*
* 字符类
* []里面的字符可以表示任意一个字符
* [0-9] 匹配任何一个数字
* [a-z] 匹配任何一个小写字母
* [A-Z] 匹配任何一个大写字母
* [a-zA-Z0-9] 匹配任何一个英文字母或者数字
*[a-zA-Z0-9_]
* */
// console.log("bcbdbebfba".match(/b[acd]/g));//[]内的内容任选其一
// /[1-31]/
// console.log("aaabvde".match(/[A-z]/));//错误的
// console.log("abc\\cde".match(/c[\\d]/));// c\ cd
// console.log("[a][b]".match(/[\[\]]/g));// 查找[ ]
// console.log("aabcdcaa".match(/[aabbcda]/));//[abcd]
// console.log("a.bcad".match(/a[.d]/g)); //如果.在[]中,失去了通配符的作用变成字符.
// /[012][0-9][0-9][0-9]-[01][0-9]-[0-3][0-9]/
/*
* ^ 反义 必须在[]里的第一个位置
* 在[]中加入^,表示除了这个中括号里面的内容以外的字符
* 如果^不在第一位,表示的是一个^的字符
*
* */
// console.log("abacadaeaf".match(/a[^def]/g));//ab ac
// console.log("abacadaeaf".match(/a[\^def]/g));//这里将^转义为字符^
// console.log("abacadaeaf".match(/a[d^ef]/g));//ad a^ ae af
// /[^^]/ 除了^字符以外
/*
* \w [0-9a-zA-Z_] 相同
* \W [^0-9a-zA-Z_] 相同,除了0-9a-zA-Z_之外的所有字符
* \d [0-9] 相同
* \D [^0-9] 相同 除了数字以外的其他字符
* \s 空白字符
* \S 除了空白字符之外的其他字符
*
*
*
*
* */
/* var divs=document.querySelectorAll("div");
removeClass(divs[0],"div1");
function addClass(elem,className) {
var arr=elem.className.trim().split(/\s/);
if(arr.indexOf(className)>-1) return;
arr.push(className);
// arr=Array.from(new Set(arr));
arr=arr.filter(function (t) { return t!=="" });
elem.className=arr.join(" ");
}
function removeClass(elem,className) {
var arr=elem.className.trim().split(/\s/);
if(arr.indexOf(className)<0) return;
arr.splice(arr.indexOf(className),1);
arr=arr.filter(function (t) { return t!=="" });
elem.className=arr.join(" ");
}
*/
1.4 重复
// /[0-9][0-9][0-9][0-9]-[0-9][0-9]-[0-9][0-9]/;
// /\d\d\d\d-\d\d-\d\d/
// /\d{4}(-\d{2}){2}/
// console.log("bbacaacc".match(/a{2}/));
// console.log("bbacaacc".match(/a{5}/));
// console.log("bbacaacc".match(/a{0}/g));//所有字符{0} 都表示""
// "a"+""+"b"="ab"
// /[{}]/
// console.log("aaaaaaaaa".match(/a{2,5}/g));//贪婪重复,重复2-5次
// console.log("aaaaaaaaa".match(/a{1,3}/g));
// console.log("aaaaaaaaa".match(/a{0,3}/g));//最后一个空字符串,0次就是最少匹配一个""
// console.log("aaaaaaaa".match(/a{0,6}/g));
// console.log("aaaaaaaa".match(/a{0,}/g));//匹配最少0个,重复最大 2个
// console.log("aaaaaaaa".match(/a*/g));//匹配最少0个,重复最大 2个
// console.log("aaaaaaaa".match(/a+/g));//匹配最少1个,重复最大 1个
// console.log("colour".match(/colou{0,1}r/));//匹配u存在或者不存在都行
// console.log("colour".match(/colou?r/));//匹配u存在或者不存在都行
// var div=document.querySelector("div");
// div.innerHTML=div.innerHTML.replace(/things{0,1}/,"<span class='redFont'>thing</span>")
//{0,1} ?
//{1,} +
//{0,} *
// .*? 最少匹配一个""字符串(优先匹配最少的) (.{0,}){0,1}
// console.log("<div><><span></span></div>".match(/<.*?>/g));
// 在重复的次数后面增加{0,1}重复或者? 就表示非贪婪重复
// console.log("aaaaaaaaa".match(/a{2,5}?/g));//非贪婪匹配
// console.log("aaaaaaaaa".match(/a{2}/g));//非贪婪匹配
// console.log("<div><><span></span></div>".match(/<[^<>]{4,}?>/g));//用于两个字符直接查找最少内容
// var str="上口径阿斯利康大家啊恐龙当家第0章按实际打开了四大皆空垃圾是的徕卡四季豆第1034章奥斯卡来得及阿斯加大款来得及";
// str=str.replace(/第\d+?章/g,"<p></p>第0章<p></p>");
// console.log(str);
var str='asdasd"asdasd"asdasd"asdasd"asdas"'
1.5 选择和起始结束
/*
* | 使用一个| 叫做或者
* 选择是有顺序的,先后顺序
*
* */
// console.log("catdog".match(/cat||dog/g));// cat|""|dog/g
// console.log("catdog".match(/|cat|dog/g));// /""|cat|dog/g;
// console.log("catdog".match(/cat|dog|/g));// /cat|dog|""/g;
// var div=document.querySelector("div");
// div.innerHTML=div.innerHTML.replace(/(things?|fears?)/g,"<span class='redFont'>$1</span>")
// div.innerHTML=div.innerHTML.replace(/(thing|fear)s?/g,"<span class='redFont'>$1</span>")
/*
* ^ 起始符
* $ 结束符
*
*
*
* */
// console.log("catdog".match(/^cat$/g));
var input,span;
var ids=0;
init();
function init() {
input=document.querySelector("input");
span=document.querySelector("span");
input.addEventListener("input",inputHandler);
}
function inputHandler(e) {
if(ids) return;
ids=setTimeout(testStringHandler,500);
}
function testStringHandler() {
clearTimeout(ids);
ids=0;
if(/^[1-9]$|^[12]\d$|^3[01]$/.test(input.value)){
span.textContent="正确";
span.style.color="green";
}else{
span.textContent="错误"
span.style.color="red";
}
}
1.6 分组和紧随其后
/*
* () 分组
* 纯()查找 表示查找空字符
*
* 主要用于replace
*
* */
// console.log("aaaaaaaba".match(/(a+?)/g))
// console.log("aaaaaaaba".match(/()/g))
// console.log("catdog".match(/(ca(t))|(dog)/g));
// console.log("catdog".match(/ca(t?)/g));
// var str="<西游记><水浒><三国演义><红楼梦>";
// str=str.replace(/<(.*?)>/g,"《$1》");
// console.log(str);
// var tel="18616532457";
// console.log(tel.replace(/(\d{3})(\d{4})(\d{4})/,"$1****$3"));
// $1-$9 先前后,再外内
// console.log("2019-12-05".replace(/(\d{4})((-\d{2}){2})/,"$1$3"))
// ?=n 紧随其后条件
// console.log("abcacdaef".replace(/a(?=cd)/g,"0"))
// ?!n
// console.log("abcacdaef".replace(/a(?!cd)/g,"0"));
// /^(?=\D+\d)(?=.*[a-z])(?=.*[A-Z])[0-9a-zA-Z]{8,16}$/;
// /[\u4e00-\u9fa5]*/ 匹配所有任意中文字符
// console.log(/^\w+@\w{2,}.\w{2,}(.\w{2,})?$/.test("x@163.com"));
// /^\d{17}(\d|X)$/ //身份证号码验证
二、正则扩展
三、正则ppt