JS经典正则表达式笔试题汇总


Posted in Javascript onDecember 15, 2016

本文实例总结了JS经典正则表达式笔试题。分享给大家供大家参考,具体如下:

一.复习字符串的传统操作

如何获取一个字符串中的数字字符,并按数组形式输出,如

dgfhfgh254bhku289fgdhdy675gfh

输出[254,289,675]

分析:循环用charAt()的方法获取到每一个子字符串,判断他是不是在0~9之间,是就把他扔到准备好的数组里

var str="dgfhfgh254bhku289fgdhdy675gfh";
findNum(str);
function findNum(){
 var arr=[];
 for(var i=0;i<str.length;i++){
  if(str.charAt(i)<='9'&&str.charAt(i)>='0'){
   arr.push(str.charAt(i));
   alert(arr);
  }
 }
}

但是这样会输出[2,5,4,2,8,9,6,7,5]和我们想要的结果有点偏差,于是我们需要一个新的空的字符串,每次碰到是数字走if,碰到字符走else,走else的时候把之前那些数字存放到新的空的字符串里,然后通过push添加到数组,然后清空字符串,一以便下次重新存放

var str="dgfhfgh254bhku289fgdhdy675";
findNum(str);
function findNum(){
 var arr=[];
 var result="";
 for(var i=0;i<str.length;i++){
  if(str.charAt(i)<='9'&&str.charAt(i)>='0'){
   result+=str.charAt(i);  //注意添加方向不要反了
  }
  else{
   if(result){
    arr.push(result);
    result="";
   }
  }
 }
 alert(arr)
}

还有个隐患:如果最后以数字结尾,则最后不会进入else,最后几位数字会读不到,因此for循环外面再添加一遍else里面的if循环

二.什么是正则,有什么用

正则:也叫做规则,让计算机能够读懂人类的规则

*前端哪些地方用到正则?

比如注册页面输入用户名,我们给定一套规则,判断他输入的对不对

*范围?

正则都是用来操作字符串的(即不要用他去操作对象什么的)

*怎么写?

正则也是一个系统对象,跟数组、json一样,也有个写法规则

简写   var re=//;  //只写两斜杠,浏览器会认为是注释,所以尽量不要给他为空,注意两斜杠之间不要有引号

全称   var re=new RegExp();  //Reg是正则的简写,Exp是表达式的简写

大部分情况用简写,只有一种情况用全称写法:正则需要传参的时候

注:全称写法用到\时,需要两个\\,否则是转义字符

三.正则表达式的常用方法

1.test

正则去匹配字符串,如果匹配成功就返回真,匹配失败就返回假

写法:正则.test(字符串)

如:

var str='abcdef';
var re=/b/; //bc一个整体也在字符串中,弹出true,但是写bd,弹出false,因为字符串中没有bd这么一个整体
alert(re.test(str));

弹出true

扩展:

检测一个字符串是不是全是数字

var str='8621t56461';
var re=//;
if(re.test(str)){
 alert("不全是数字");
}
else{
 alert("全是数字");
}

两斜杠之间要写什么呢?引入转义字符

\s(\S):空格(非空格)

\d(\D):数字(非数字)

\w(\W):字符(非字符)   字符包括字母、数字、下划线

2.search

正则去匹配字符串,如果匹配成功,就返回匹配成功的位置,如果匹配失败就返回-1

search的写法:字符串.search(正则)

如:

var str="abcdef";
var re=/b/;
alert(str.search(re));
//返回1
var re=/w/;
//返回-1
var re=/B/;
//返回-1

正则中的默认:是区分大小写的

如果要不区分大小写,在正则的最后加标识i

var re=/B/i

完整写法:

var re=new RegExp("B","i");

3.match

正则去匹配字符串,如果匹配成功,就返回匹配成功的数组,如果匹配不成功,就返回null

match的写法:字符串.match(正则)

比如上面例子要找出数字

var str="dgfhfgh254bhku289fgdhdy675";
var re=/\d/;
alert(str.match(re));
//输出2

为什么后面的不找了?

正则默认:正则匹配成功就会结束,不会继续匹配

如果想要全部查找,就要加标识g(全局匹配)

var re=/\d/g;
//输出2,5,4,2,8,9,6,7,5

跟我们想要的结果还是有偏差,如果要连着找到,而不是一个个分开,则需要

var re=/\d\d/g; //两个两个找
var re=/\d\d\d/g; //三个三个找

但是个数不一定时怎么找,引进量词

量词:匹配不确定的位置

+:至少出现一次

var re=/\d+/g;

就实现上面的效果了

4.replace

正则去匹配字符串,匹配成功的字符去替换新的字符串

replace的写法:字符串.replace(正则,新的字符串)

如:

var str="aaa";
var re=/a/;
str=str.replace(re,"b");
alert(str);
//输出baa

敏感词过滤例子

str.replace(re,"*");

但是如果有很多词要过滤,不能写成一整段,这样匹配不到,怎样把一个词一个词分开呢

|:或的意思

新的问题:所有敏感词都会替换成一颗星,怎样做到几个字几颗星呢?

replace()的第二个参数,可以是字符串,可以是回调函数

str.replace(re,function(){
 return '*';
});

现在和上面那句话作用一样

回调函数的第一个参数,就是匹配成功的字符,即可以通过第一个参数的长度,来给他返回几颗星

str.replace(re,function(str){
 var result='';
 for(var i=0;i<str.length;i++){
  result+='*';
 }
 return result;
});

四.正则表达式字符类

字符类:一组相似的元素(用[]表示[]的整体代表一个字符,()是分组和子项的意思)

1.任意字符

[abc]

如o[usb]t--obt、ost、out

2.范围

[a-z]、[0-9]

如id[0-9]--id0、id5

3.排除

[^a]

如o[^0-9]t--oat、o?t、o t

例子:过滤标签

过滤掉<>(如<div>、</div>、<h2 class="sfsdf">)

var re=/<[\w\W]+>/g;  //中括号里是或的关系,也就是字符或非字符都有了,包括了斜杠,引号等

另一种做法:    var re=/<[^>]+>/g;

五.正则表达式转义字符

.(点):任意字符       \.:真正的点

\s(\S):空格(非空格)

\d(\D):数字(非数字)

\w(\W):字符(非字符)   字符包括字母、数字、下划线

\数字:重复子项(\1:重复的第一个子项,\2:重复的第二个子项...)

var str="abca";
var re=/(a)(b)(c)\1/ ; //true,为什么不用var re=/(a)(b)(c)\a/ ;一样能匹配成功,\数字,用于不确定的子项字符
var re=/(a)(b)(c)\2/ ; //false
alert(re.teat(str));

例子:找某个字符串中出现最多的字符和它一共出现多少次

var str="vbbbbhybbfhbbgbbb";
var arr=str.split("");
str=arr.sort().join("");
var value=""; //存放出现最多的字符
var index=0; //存放次数
var re=/(\w)\1+/g;

没有\1,re就是一整个排好序的字符串,有了\1就是出现过的有重复的取出来像这样bbb...,hh

str.replace(re,function($0,$1){ //$0代表整体,$1代表第一个子项
 if(index<$0.length){ //$0:每一组重复的元素
  index=$0.length;
  value=$1;
 }
})
alert('出现最多的字符是'+value+',出现次数是'+index);

\b(\B):独立的部分(非独立的部分)  独立的部分(起始、结束、空格)

如:

var str="onetwo";
var re=/\bone/; //起始位置,true
var re=/one\b/; //false,要true,one和two之间加空格或者只有one
alert(re.test(str));

独立部分应用举例

之前有用到用封装好的函数来获取className

function getByClass(oparent,sClass){
 var aEle=oparent.getElementsByTagName("*");
 var aResult=[];
 var i;
 for(i=0;i<aEle.length;i++){
  if(aEle[i].className==sClass){
   aResult.push(aEle[i]);
  }
 }
 return aResult;
};

这个会有bug

<div class="box1"></div>
<div class="box1box2"></div>
<div class="box1 box2"></div>

用这个方法获取box1,只能获取到第一个

用正则来改写

function getByClass(oparent,sClass){
 var aEle=oparent.getElementsByTagName("*");
 var aResult=[];
 var i;
 var re=new RegExp('\\b'+sClass+'\\b')
 for(i=0;i<aEle.length;i++){
  if(re.test(aEle[i].className)){
   aResult.push(aEle[i]);
  }
 }
 return aResult;
};

六.量词

不确定的字符个数

量词:{}

{4,7}   最少出现4次,最多出现7次

{4,}     最少出现4次

{4}      正好出现4次

+是{}的简写,相当于(1,)

? 相当于{0,1}    //出现0次或者1次

* 相当于{0,}     //至少出现0次,可以没有

七.正则收尾

^:正则的最开始位置,表示起始的意思

$:正则的最后,表示结束的意思

例子:去掉字符串里的空格

var re=/^\s+|\s+$/g;
str.replace(re,"");

例子:检测邮箱

var re=/^\w+@[a-z0-9]+(\.[a-z]+){1,3}$/;

八.前向声明和反前向声明

(?=) :前向声明

(?!):反前向声明

举例

var str="abacad";
var re=/a(?=b)/g;
str=str.replace(re,"*");
alert(str);

输出:*bacad

如果改为

var re=/a(?!b)/g;

输出:ab*c*d

Javascript 相关文章推荐
jquery ajaxSubmit 异步提交的简单实现
Feb 28 Javascript
Node.js(安装,启动,测试)
Jun 09 Javascript
推荐一款jQuery插件模板
Jan 09 Javascript
JS JQUERY实现滚动条自动滚到底的方法
Jan 09 Javascript
JS组件Bootstrap Table使用方法详解
Feb 02 Javascript
vue.js实现表格合并示例代码
Nov 30 Javascript
常用JS图片滚动(无缝、平滑、上下左右滚动)代码大全(推荐)
Dec 20 Javascript
原生js简单实现放大镜特效
May 16 Javascript
Angular 4根据组件名称动态创建出组件的方法教程
Nov 01 Javascript
VUE接入腾讯验证码功能(滑块验证)备忘
May 07 Javascript
微信小程序select下拉框实现效果
May 15 Javascript
Vue和React有哪些区别
Sep 12 Javascript
javascript中闭包概念与用法深入理解
Dec 15 #Javascript
javascript读取文本节点方法小结
Dec 15 #Javascript
EditPlus中的正则表达式 实战(4)
Dec 15 #Javascript
jQuery validate插件功能与用法详解
Dec 15 #Javascript
EditPlus 正则表达式 实战(3)
Dec 15 #Javascript
js实现点击每个li节点,都弹出其文本值及修改
Dec 15 #Javascript
EditPlus中的正则表达式 实战(2)
Dec 15 #Javascript
You might like
php Imagick获取图片RGB颜色值
2014/07/28 PHP
windows下的WAMP环境搭建图文教程(推荐)
2017/07/27 PHP
可输入的下拉框
2006/06/19 Javascript
Prototype RegExp对象 学习
2009/07/19 Javascript
javascript 正则替换 replace(regExp, function)用法
2010/05/22 Javascript
Javascript计算时间差的函数分享
2011/07/04 Javascript
jquery插件珍藏(图片局部放大/信息提示框)
2013/01/08 Javascript
js封装可使用的构造函数继承用法分析
2015/01/28 Javascript
jQuery聚合函数实例
2015/05/21 Javascript
尝试动手制作javascript放大镜效果
2015/12/25 Javascript
jquery if条件语句的写法
2016/05/19 Javascript
jQuery zTree树插件简单使用教程
2017/01/10 Javascript
使用JS在浏览器中判断当前网络连接状态的几种方法
2017/05/05 Javascript
浅谈vue中数据双向绑定的实现原理
2017/09/14 Javascript
Vuejs 2.0 子组件访问/调用父组件的方法(示例代码)
2018/02/08 Javascript
详解vue2.0+axios+mock+axios-mock+adapter实现登陆
2018/07/19 Javascript
vue-router实现嵌套路由的讲解
2019/01/19 Javascript
vue-cli2与vue-cli3在一台电脑共存的实现方法
2019/09/25 Javascript
Vue实现base64编码图片间的切换功能
2019/12/04 Javascript
[01:39:42]Fnatic vs Mineski 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
Python的Django框架中TEMPLATES项的设置教程
2015/05/29 Python
深入讲解Python编程中的字符串
2015/10/14 Python
Python处理JSON时的值报错及编码报错的两则解决实录
2016/06/26 Python
获取python文件扩展名和文件名方法
2018/02/02 Python
Django migrations 默认目录修改的方法教程
2018/09/28 Python
Python实现平行坐标图的两种方法小结
2019/07/04 Python
英国泰坦旅游网站:全球陪同游览,邮轮和铁路旅行
2016/11/29 全球购物
美国在线面料商店:Fashion Fabrics Club
2020/01/31 全球购物
医院护理人员的自我评价分享
2013/10/04 职场文书
初中音乐教学反思
2014/01/12 职场文书
我的理想演讲稿
2014/04/30 职场文书
公司年会策划方案
2014/05/17 职场文书
反对邪教标语
2014/06/30 职场文书
教师学习心得体会范文
2016/01/21 职场文书
SpringBoot使用ip2region获取地理位置信息的方法
2022/06/21 Java/Android
MySQL新手入门进阶语句汇总
2022/09/23 MySQL