无私分享JavaScript的一些RegExp实例和几道面试题

2019-04-03 本文已影响14人果然

原创RegExp面试题无私分享

转义字符 \

var zz = document.getElementById('zhengze');
var str = "abcd\"ef";//abcd"efg
    str = "abcd\\ef";//abcd\ef 转义了转义字符
    str = "abcd\nef";//\n是换行符 但在文档里面无法看到换行
    str = "abc\rdef";//\r 匹配一个回车符
    str = "abc\r\ndef"
console.log(str);
zz.innerHTML = str;

转义字符很简单,不解释.

RegExp的创建方法:

第一种创建方法 reg.test(str2); i是忽略大小写

var reg = /abc/;
var str2 = "abcdefg";
    reg = /abc/i;
    str2 = "AbCdEfG";
console.log(str2);
console.log(reg.test(str2));

第二种创建方法 reg3 = new RegExp("abc");

var str3 = "abcdef";
var reg3 = new RegExp('abc');
console.log(reg3.test(str3));

第二种方法中带参数的 reg4 = new RegExp("abc","i");

var str4 = "abc24243abcruurabcrwr";
var reg4 = new RegExp('abc','i');
var reg6 = new RegExp('abc','g');
console.log(reg4.test(str4));       
console.log(str4.match(reg6));

new RegExp()后面的括号里,除了放字符串还能放其他正则表达式.

var reg5 = new RegExp(reg);

注意:上面的表达式如果不带new,两个都是相同的一个reg.
test()和match()的使用.
//reg.test();
//str.match();

var str6 = "1 plus 2 equal 3";
console.log(str6.match(/\d+/g));// ["1", "2", "3"] 数组

var str7 = "abcde\na";
console.log(str7.match(/^a/gm));//["a", "a"]
//m的功能——即使断行的字符串，也能匹配的到

注意:上面的例子,展示了m的功能--即使断行的字符串，也能匹配的到.

量词实例

//量词 n+
var reg1 = /\w+/g;
var str1 = "abc";
console.log(str1.match(reg1));//["abc"]

//量词 n*  n*  {0, }
reg1 = /\w*/g;
console.log(str1.match(reg1));
//["abc", ""] 两个数值，后面的空数值，是找完第一个数值后，游标所在的位置的数值
reg1 = /\d*/g;
console.log(str1.match(reg1));//["", "", "", ""] 
// \d 匹配数字，因为*，输出4个空数值，也是游标的4各位置
//n?  n? --> {0,1}
reg1 = /\w?/g;
console.log(str1.match(reg1));//["a", "b", "c", ""]
//n {X}
reg1 = /\w{3}/g;//3个3个的匹配
str1 = "abcfsfsfhlkjeoure";
console.log(str1.match(reg1));// ["abc", "fsf", "sfh", "lkj", "eou"]
//n{x,y}x到y个
reg1 = /\w{3,5}/g;//匹配3到5个,能凑5个绝不凑4个,能凑4个绝不凑3个.贪婪匹配
str1 = "abcfsfsfhlkjeoure3";
console.log(str1.match(reg1));//["abcfs", "fsfhl", "kjeou", "re3"]
//n{x,} 匹配x到正无穷大,{1,}===n+, {0,}===n*;
reg1 = /\w{4,}/g;
console.log(str1.match(reg1));//["abcfsfsfhlkjeoure3"]

面试题1：检验一个字符串首尾是否有数字,注意读题,首或者尾有就行.

var reg2 = /^\d|\d$/g;
var str1 = "abcfsfsfhlkjeoure3";
var str2 = "124shgeighERERdsdf459";
console.log(str2.match(reg2));//["1", "9"]
console.log(str1.match(reg2));//["3"]

面试题1-1：检验一个字符串首尾"都"是否有数字

reg2 = /^\d[\s\S]*\d$/g;
str2 = "124shgeighERERdsdf459";
console.log(str2.match(reg2));//["124shgeighERERdsdf459"]
console.log(str1.match(reg2));//null;

exec方法

//exec 和 lastIndes
var reg3 = /ab/g;
var str3 = "abababababab";
console.log(reg3.lastIndex);// 0  游标位置
console.log(reg3.exec(str3));
// 类数组 ["ab", index: 0, input: "abababababab", groups: undefined]
console.log(reg3.lastIndex);//2  游标位置
console.log(reg3.exec(str3));
//["ab", index: 2, input: "abababababab", groups: undefined]

面试题2:筛选出一个字符串中,4个相同字符的字符串

var str4 = "aaaabbbb哈哈哈哈";
var reg4 = /(\D)\1\1\1/g;
//反向引用子表达式(\w),\1拷贝一份\w ,\1\1\1拷贝3分,形成4个相同的
console.log(str4.match(reg4));// ["aaaa", "bbbb", "哈哈哈哈"]


//找出一个字符串中,"aabb"的字符串
str4 = "sdsd红红火火恍恍惚惚嘿嘿哈哈";
reg4 = /(\D)\1(\D)\2/g;
//\1是匹配一个字符,\2是匹配第二个字符
console.log(str4.match(reg4)); ["红红火火", "恍恍惚惚", "嘿嘿哈哈"]

//如果不带g, ["红红火火", "红", "火",]
//其中"红"是第一个子表达式(\D)的内容,"火"是第二个子表达式(\D)的内容


//search   
console.log(str4.search(reg4));// 4 //search返回匹配到的位置
//search匹配不到返回-1

replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。

//replace()方法
var str5 = "aa";
var reg5 = /a/g;
console.log(str5.replace("a", "b"));//ba  //只能匹配一个.
console.log(str5.replace(reg5, "b"));//bb,如果不加g,也只能匹配一个.

//将"aabb"的字符串,倒过来,变成"bbaa"

var str6 = "sdsd红红火火恍恍惚惚嘿嘿哈哈";
var reg6 = /(\D)\1(\D)\2/g;
console.log(str6.replace(reg6, "$2$2$1$1"));
//sdsd火火红红惚惚恍恍哈哈嘿嘿

console.log(str6.replace(reg6,function(name1,$1,$2){
    //这里的第一个形参,是正则表达式匹配的全局结果aabb,随便给个名字
    //第二个形参是第一个表达式的内容,第三个形参是第二个表达式的内容
    return $2 + $2 + $1 + $1;
}));//sdsd火火红红惚惚恍恍哈哈嘿嘿

面试题3: 将字符串"the-first-name"变成小驼峰样式

var reg7 = /-(\w)/g;
var str7 = "the-first-name";
console.log(str7.replace(reg7,function(name, $1){
    return $1.toUpperCase();
}));//theFirstName

正向预查和正向断言

var str8 = "abaaaaccc";
var reg8 = /a(?=b)/g;//查找b前面的a
console.log(str8.match(reg8));//["a"]

reg8 = /a{1,3}?/g;//加个?变成非贪婪匹配,能匹配1个,绝不匹配2个
console.log(str8.match(reg8)); ["a", "a", "a"]

加个?,变成非贪婪匹配

var reg9 = /(\w+)\s(\w+)/;
var str9 = "sfssge wgsg sgsgs sgggdogj"
console.log(str9.replace(reg9,'$$ $$'));
//前两个匹配的表达式替换成$ ,$ $ sgsgs sgggdogj

面试题4:将一个字符串内相同的字符去重,过滤成一个.

var str10 = "aaaabbbbbbccccccdddd";
var reg10 = /(\w)\1*/g;
console.log(str10.replace(reg10,'$1'));//"abcd"

面试题5:给你一串字符串,把它按空格分隔开来.

var reg1 = /\S+/g;
var str1 = "abc ewur 123 .,.,131";
console.log(str1.match(reg1));// ["abc", "ewur", "123", ".,.,131"]

下面来点有难度的吧!!

面试题6:在随机给出的字符串内,匹配第一次出现的数字,要能匹配带小数点数字,能匹配科学计数法的数字,能匹配正负数,如出现192.168.0.1,需要过滤掉后面的.只留下192.168

var reg1 = /[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/;
var str1 = "abc -324.43.123.65+1-23jdgr5685ewur";
console.log(str1.match(reg1));//"-324.43"

匹配一对儿不能带其他字符的html标签或单个html标签,

var reg1 = /^<(\w+)\s*\/?>(?:<\/\1>|)$/;
var str1 = "<div></div>";
console.log(str1.match(reg1));// <div></div>

var reg1 = /^<(\w+)\s*\/?>(?:<\/\1>|)$/;
var str1 = "<div>";
console.log(str1.match(reg1));// <div>

var reg1 = /^<(\w+)\s*\/?>(?:<\/\1>|)$/;
var str1 = "<2></2>";
console.log(str1.match(reg1));// <2></2>

var reg1 = /^<(\w+)\s*\/?>(?:<\/\1>|)$/;
var str1 = "<2>";
console.log(str1.match(reg1));// <2>

匹配一对儿html标签或单个html标签,可以带其他字符

var reg1 = /^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/;
var str1 = "  <div  id='12'>5 55 < /div > ";
console.log(str1.match(reg1));//   <div  id='12'>5 55 < /div >

var reg1 = /^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/;
var str1 = "  <div  id='12'>5 55  ";
console.log(str1.match(reg1));//     <div  id='12'>5 55  

var reg1 = /^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/;
var str1 = "  <div  id='12'>wrwre5 55 <dsda> ";
console.log(str1.match(reg1));//   <div  id='12'>wrwre5 55 <dsda>

匹配短横线(-)和它后面的一个字母或数字

var reg1 = /-([\da-z])/gi;
var str1 = "-<d-12i3v- - -id='-12'->-w5rwre5 55 -<dsda> ";
console.log(str1.match(reg1));//  ["-1", "-i", "-1", "-w"]

(?:x)实例
匹配 x 不会捕获匹配项。这被称为非捕获括号（non-capturing parentheses）。匹配项不能够从结果数组的元素 [1], ..., [n] 或已被定义的 RegExp 对象的属性 $1, ...,$ 9 再次访问到。

var reg1 = /(?:x)/g;
var str1 = "-<d-12i3v- - -id='x xxx-12'->-w5rwre5 55 -<dsda> ";
console.log(str1.match(reg1));//  ["x", "x", "x", "x"]

还是 (?:x)的实例
只返回匹配的内容（包括该组匹配的内容）
不返回该组匹配的内容.

var m = 'abc'.match(/(?:.)b(.)/); m // ["abc", "c"]

var reg1 = /(?:.)b(.)/g;
var str1 = "-<d - idbbbbbb='x xxab1dx-12'b->-w5rwre5 55 -<dsda> ";
console.log(str1.match(reg1));//  ["dbb", "bbb", "ab1", "'b-"]