JavaScript(正则表达式一)

--------------------
创建正则表达式:

验证匹配的两个方法

//正则表达式测试
/*
var p=new RegExp("Box","i");//i表示忽略大小写
var str="this is box";
alert(p.test(str));//页面打印true 如果没有i这个参数 表示不忽略大小写 那么就是会打印false
*/
/*
var p=/Box/i;
var str="This is box";
alert(p.test(str));//打印true
*/
// alert(/Box/i.test("this is box"));
alert(/Box/i.exec("this is box"));//页面将会打印box 表示在忽略大小写的情况下 Box和this is box匹配的结果为 box
正则表达式.test("将要验证的内容"); test返回boolean值 exec方法返回的是匹配的内容
-----------------------------------------------

match方法:
//String中提供的验证方法
var p=/box/ig;//忽略大小写 并且全局匹配
var str="this is a box,this is a Box";
alert(str.match(p));//该方法需要注意 因为是string提供的方法 所以这里调用的是str.方法名(正则) 而且该方法返回的是一个数组

因为匹配的是全局,所以能够打印所有的匹配内容,修改代码:
var p=/box/i;//忽略大小写 没有进行全局匹配
var str="this is a box,this is a Box";
alert(str.match(p));//

可以看到只匹配了第一个box
如果没有匹配的内容 ,那吗就返回null
--------------------------------
search方法
var p=/box/ig;//忽略大小写 进行全局匹配
var str="this is a box,this is a Box";//从零开始 空格也算一个位置
alert(str.search(p));//打印10 说明第一个匹配的位置是从10开始的


只会返回第一个匹配的位置
如果找不到 那么返回-1
var p=/xox/ig;
var str="this is a box,this is a Box";
alert(str.search(p));//找不到 返回-1

-------------------------------------
replace方法
var p=/box/ig;//开启全局 不区分大小写
var str="this is a box,this is a Box";
alert(str.replace(p,"tom"));//这个方法返回替换之后的str内容 第一个参数是将要被替换的内容规则 第二个参数是实际替换的值

如果不开启全局,那么只会替换第一个

------------------------------------------------
split方法:
var p=/ /ig;//开启全局 不区分大小写
var str="this is a box,that is a Box";
alert(str.split(p));//拆分的方法 返回的是一个数组 根据正则表达式中的拆分规则进行拆分 此处按照空额进行拆分
alert(str.split(p).length);//打印拆分之后数组的长度


--------------------------------------------------
RegExp的属性(没啥屌用 了解一下)


------------------------------------------------
匹配正则表达式规则: /匹配规则/



--------------------------------------
贪婪模式转换懒惰模式

对贪婪、惰性模式的理解:
不使用贪婪,不使用全局
var pattern=/[a-z]/;//最初效果 不使用全局 只匹配了第一个字母 a
var str="abcd";
//alert(pattern.test(str));
alert(str.replace(pattern,"1"));//把匹配的字母替换为数字1 因为只匹配了第一个字母 所以效果为1bcd

不使用贪婪,使用全局
var pattern=/[a-z]/g;//匹配一个字母 但是使用了全局
var str="abcd";
//alert(pattern.test(str));
alert(str.replace(pattern,"1"));//把匹配的字母替换为数字1 因为使用了全局
// 在匹配第一个字母之后 仍然会继续匹配后面符合条件的内容 就造成把所有的匹配内容都做替换 所以效果为1111

贪婪模式,不使用全局
var pattern=/[a-z]+/;//贪婪模式 不使用全局
var str="abcd";
//alert(pattern.test(str));
alert(str.replace(pattern,"1"));//[a-z]+的匹配内容为至少一个以上a-z的字母 所以就把abcd都匹配了 然后把匹配的内容替换为1 所以最终效果就是1

贪婪模式,使用全局
var pattern=/[a-z]+/g;//贪婪模式 使用全局
var str="abcd";
//alert(pattern.test(str));
alert(str.replace(pattern,"1"));//贪婪模式并且使用了全局 [a-z]+的匹配内容是把所有符合条件的字符进行匹配 无论是否全局 都会把abcd都进行匹配

懒惰模式,不使用全局
var pattern=/[a-z]+?/;//懒惰模式 不使用全局
var str="abcd";
//alert(pattern.test(str));
alert(str.replace(pattern,"1"));//惰性模式 [a-z]+?的匹配内容为0个或者1个a-z的字母 所以就只会匹配第一个字母a 然后把匹配的内容替换为1 所以最终效果就是1bcd

懒惰模式,使用全局
var pattern=/[a-z]+?/g;//惰性模式 使用全局
var str="abcd";
//alert(pattern.test(str));
alert(str.replace(pattern,"1"));//惰性模式并且使用了全局 [a-z]+?的匹配内容是只匹配0个或1个符合条件的字符 匹配成功之后 就不会继续向后匹配
// 但是使用了全局 就会在匹配第一个成功之后 仍然继续向下进行匹配(执行替换时,替换一个之后 ,继续向下把符合条件的内容进行替换) 所以最终效果就是1111

总结:
//全局的效果是在执行替换的时候才发挥作用,作用是匹配到一个符合条件的内容之后 继续向后找 否则就不向后找
// /[a-z]/g 效果1111 /[a-z]+/ 效果是1 第一个是只匹配一个a-z字母 但是使用了全局 就会在执行替换成功之后
// 继续向下进行寻找 因为使用了全局嘛 找到最后为止(执行效果:1bcd 11cd 111d 1111)
// 而第二个是执行之前 就已经匹配了所有 [a-z]+的意思不就是1个以上的a-z字母吗 即/[a-z]+/完全匹配abcd 所以替换的时候把所以的字母替换成了1
----------------------------------
分组匹配:
//使用分组匹配
var pattern=/^([a-z]+)\s([0-9]{4})$/;
var str="google 2012";
alert(pattern.exec(str).length);//查看返回的数组的长度
alert(pattern.exec(str));//输出数组中的全部内容 中间使用逗号分隔
// 第一个元素是匹配到的整个字符串 第二个元素:匹配到的第一个分组的字符串 第三个元素:匹配到的第二个分组的字符串
//下面分别打印观察结果:
var result=pattern.exec(str);
alert("匹配到的整个内容:"+result[0]);
alert("匹配到的第一个分组的字符串:"+result[1]+",即RegExp.$1的值:"+RegExp.$1);
alert("匹配到的第二个分组的字符串:"+result[2]+",即RegExp.$2的值:"+RegExp.$2);
运行效果:





----------------------------------------------
去除字符串的前后空格问题:
//取出前后的空格:第一种 分批去除空格
var pattern=/^\s*/;
var str=" goo gle "//最后的效果 goo gle前后空格都要去掉
var result=str.replace(pattern,'');
alert("|"+result+"|");//此处已经去除了前面的空格了
pattern=/\s*$/;
result=result.replace(pattern,'');
alert("|"+result+"|");


------------
//取出前后的空格:第二种 一个正则表达式 之前一次性把前后都去掉
var pattern=/^\s*(.*?)\s*$/;//这里需要注意了 如果是贪婪模式.*那么就是把之后的空格也都给匹配了[goo gle ]
// 惰性模式的时候 ^\s*匹配前边 \s*$匹配后边 所以中件的部分只会匹配到[goo gle] 而正好中间的部分使用了分组
// 在执行了exec方法之后 RegExp.$1中的值就是我们需要的(第一个分组中匹配的内容)
var str=" goo gle "//最后的效果 goo gle前后空格都要去掉
//alert(pattern.test(str));
alert("|"+pattern.exec(str)+"|");//上面使用了分组 所以返回的时候 第1个元素是匹配全部的内容 第二个元素是分组中匹配到的内容
var result=str.replace(pattern,RegExp.$1);//使用RegExp.$1时 必须先执行一下exec方法
alert("|"+result+"|");

alert("|"+pattern.exec(str)+"|");这句代码打印的内容就是上面的内容 这个方法返回的是一个数组 第一个元素是 匹配的全部内容[ goo gle ]
数组中第二个元素即下标为1的那个元素 就是第一个分组匹配到的内容[goo gle] ,显然最后需要得到的内容就是第一个元素的内容 RegExp.$1

----------------------------------
域名匹配小练习
//匹配域名
//jay123.com@djif.com
// var pattern=/([a-zA-Z0-9\.\_]+)@([a-zA-Z]+)\.([a-zA-Z]{2,4})/;
var pattern=/^[\w\.\-]+@[\w\-]+\.[a-zA-Z]{2,4}/; // \w是不包括.的 包括下化线 使用分组的时候就是加上了括号 加不加都不影响执行的效果
//如果需要获取匹配对应的内容的时候 加上分组然后调用里边的$1 $2.。就能分别获得第一个分组 第二个分组中的内容 比如上面的去前后空格的程序就是一个利用加括号巧妙使用分组的练习 例如下面的练习
var str="jay123.com@dj-if.com";
alert(pattern.test(str));
获取字符串中的指定位置的内容:
//获取域名中的对应内容 比如通过用户提供的字符串信息 从而得到它的用户名 @之后的内容 .之后的内容
var pattern=/([\w\.\-]+)@([\w\-]+)\.([a-zA-Z]{2,4})/;
//上面的正则表达式中使用了3个分组 下面就得到这些分组的对应内容
var str="Joke666.com@mail.cn";
//运行exec方法(这样才可以使用RegExp.$x) 可以看到数组中的所有内容
alert("它的长度为:"+pattern.exec(str).length);
alert("它的内容为:"+pattern.exec(str));
alert("用户名(@之前的内容:)"+RegExp.$1);
alert("域名(@之后.之前的内容:)"+RegExp.$2);
alert("后缀(.之后的内容:)"+RegExp.$3);


var result=pattern.exec(str);
上面第一个方框中的内容是:全部匹配的内容(result[0]), 第二个方框:第一个分组匹配的内容(result[1]) 第三个方框:第二个分组匹配到的内容(result[2]) 第四个方框:第三个分组中匹配到的内容(result[3])



-----------------------------------------------
捕获性分组:就是把所有的分组匹配内容都返回 非捕获性分组:在不想返回该分组匹配的内容的分组前使用 ?:那么将来在返回的的数组中就不能使用RegExp.$x得到该正则分组返回的内容

前瞻性捕获:(?=限制尾部的内容)

//前瞻捕获
//var pattern=/goo/;
//var str="goobb";
//alert(pattern.test(str));//匹配成功 打印true
//alert(pattern.exec(str));//返回goo 没有使用分组 所以这里只有匹配成功的一个数据 数组的长度也是1
//但是我想做的功能是啥呢 是尾部只能是gle的才匹配
var pattern=/goo(?=gle)/;//注意这里可是没有使用分组 这里的()作用就是限定尾部的内容只能是gle的才匹配
var str="google";
alert(pattern.exec(str));//匹配成功打印goo 注意这里是打印goo 而不是google
str="goobb";
alert(pattern.exec(str));//匹配失败 打印null


---------------------------
JavaScript(正则表达式一)的更多相关文章
- JavaScript正则表达式,你真的知道?
一.前言 粗浅的编写正则表达式,是造成性能瓶颈的主要原因.如下: var reg1 = /(A+A+)+B/; var reg2 = /AA+B/; 上述两个正则表达式,匹配效果是一样的,但是,效率就 ...
- 【JS】javascript 正则表达式 大全 总结
javascript 正则表达式 大全 总结 参考整理了一些javascript正则表达式 目的一:自我复习归纳总结 目的二:共享方便大家搜索 微信:wixf150 验证数字:^[0-9]*$ 验证n ...
- 理清JavaScript正则表达式--上篇
在JavaScript中,正则表达式由RegExp对象表示.RegExp对象呢,又可以通过直接量和构造函数RegExp两种方式创建,分别如下: //直接量 var re = /pattern/[g | ...
- 理清JavaScript正则表达式--下篇
紧接:"理清JavaScript正则表达式--上篇". 正则在String类中的应用 类String支持四种利用正则表达式的方法.分别是search.replace.match和s ...
- JavaScript正则表达式详解(一)正则表达式入门
JavaScript正则表达式是很多JavaScript开发人员比较头疼的事情,也很多人不愿意学习,只是必要的时候上网查一下就可以啦~本文中详细的把JavaScript正则表达式的用法进行了列表,希望 ...
- JavaScript正则表达式详解(二)JavaScript中正则表达式函数详解
二.JavaScript中正则表达式函数详解(exec, test, match, replace, search, split) 1.使用正则表达式的方法去匹配查找字符串 1.1. exec方法详解 ...
- Python自动化 【第十八篇】:JavaScript 正则表达式及Django初识
本节内容 JavaScript 正则表达式 Django初识 正则表达式 1.定义正则表达式 /.../ 用于定义正则表达式 /.../g 表示全局匹配 /.../i 表示不区分大小写 /.../m ...
- JavaScript正则表达式下——相关方法
上篇博客JavaScript 正则表达式上——基本语法介绍了JavaScript正则表达式的语法,有了这些基本知识,可以看看正则表达式在JavaScript的应用了,在一切开始之前,看看RegExp实 ...
- JavaScript 正则表达式上——基本语法
定义 JavaScript种正则表达式有两种定义方式,定义一个匹配类似 <%XXX%> 的字符串 1. 构造函数 var reg=new RegExp('<%[^%>]+%&g ...
- 正则表达式入门教程&&经典Javascript正则表达式(share)
前言 例子: ^.+@.+\\..+$ 这样的代码曾经多次把我自己给吓退过.可能很多人也是被这样的代码给吓跑的吧.继续阅读本文将让你也可以自由应用这样的代码. 正文 教程:正则表达式30分钟入门教程 ...
随机推荐
- 项目结构、包、编译为exe!
一个java源文件里至多有一个public类,该类的名称必须与源文件名称称同样.也能够没有public类.文件名称与随意一个类名一致就可以. 包 类似于cpp的namespace,是对类的再封装,防止 ...
- 国外物联网平台初探(二) ——微软Azure IoT
平台定位 连接设备.其它 M2M 资产和人员,以便在业务和操作中更好地利用数据. 连接 IoT 设备 将所有设备连接到云,从这些设备接收大规模数据,以及管理这些设备的授权和限制. 在将设备连接到云和处 ...
- Python使用装饰器自动调用父类__init__
众所周知,Python中class的构造函数实际是__new__(),但是如果我们执行p1=Point()的时候,不仅会调用Point的__new__方法,而且会调用Point的__init__方法. ...
- 44.Qt通过子类化qstyle实现自定义外观
main.cpp #include <QtGui> #include "brozedialog.h" #include "bronzestyle.h" ...
- C# DataTable常用方法总结
https://blog.csdn.net/wangzhen209/article/details/51743118
- js原生_获取url键值对
思路: 1.先对url进行处理,获取 ?后的字符串 postid=10457794&actiontip=保存修改成功') 2. 字符串通过&标识,不同参数转为数组 ["pos ...
- javascript中构造函数的三种方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- JQuery学习笔记系列(一)----选择器详解
笔者好长时间没有更新过博客园的笔记了,一部分原因是去年刚刚开始工作一段时间忙碌的加班,体会了一种每天加班到凌晨的充实感,之后闲暇时间了也因为自己懒惰没有坚持记笔记的习惯,现在重新拾起来. 借用古人的一 ...
- RAP开发入门-布局管理
布局类继承关系 FillLayout new FillLayout(SWT.VERTICAL/HORIZONTAL)设置竖直/水平填充 RowLayout wrap折行显示.pack自适应布局(布局 ...
- 杭电1159 Common Subsequence【最长公共子序列】
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1159 解题思路:任意先给出两个字符串 abcfbc abfcab,用dp[i][j]来记录当前最长的子 ...
