正则表达式

正则表达式,一个描述字符模式的对象。javascript的RegExp类表示正则表达式,String和RegExp都定义了方法,后者使用正则表达式进行强大的模式和匹配与替换功能。 -- from Javascript权威指南第六版

正则表达式的定义

js中的正则表达式用RegExp对象表示。

同其他的对象一样,可以有字面量与构造函数的方式来创建。

  • 对正则表达式直接量,定义为在包含在一对斜杠(/)之间的字符
    var regExp = /s$/;
  • 构造函数表达方式
    var regExp = new RegExp('s$');

选择、分组和引用

正则表达式的语法还包括指定选择项目、子表达式分组和引用前一子表达的特殊字符。

选择

` | ` 字符 用于分隔选择的字符,选择项的尝试匹配次序是从左向右,直到发现了匹配项目。如果左边的选择项匹配,就忽略右边的匹配项,即使产生更好的匹配。此处的逻辑于逻辑判断的` || `的短路操作类似。

分组

圆括号在正则表达式中的含义:
  • 把单独的项组合成子表达式,以便可以像处理一个独立的单元那样用 |,*,+,?等来对单元内的项进行处理。就是一个普通结合的运算符。

  • 在完整的模式中定义子模式,即分组。在分组之后,可以利用''+数字完成对前面子表达式的引用,即所谓的反向引用。从1开始。(不从0开始的原因,个人觉得,正则表达式中的0项,一般是整体匹配的结果。)

Notice 在使用exec的过程之中,提取出来的数组的索引,从0以后即分组中的子模式的值,然而有些数据并不是我们需要的,只是在操作上简单,只有结构上的含义,不需要像其他的子分组的值取出,并适当提高处理性能,就是上面提到的圆括号的作用的第一点,不含第二点的情形,那么我们可以在圆括号内部使用(?:)来处理,就是匹配不处理。另附MDN 上,RegExp.prototype.exec 的结果解释:

Property/Index Description
[0] The full string of characters matched
[1], ...[n ] The parenthesized substring matches, if any. The number of possible parenthesized substrings is unlimited.
index The 0-based index of the match in the string.
input The original string.
var str = '我有一个邮箱, 是 abc@itcast.cn, 还有 abc@126.com, 和 1234567@qq.com';
var r = /([a-zA-Z\d]+)@([a-zA-Z\d]+(?:\.[a-zA-Z\d]+)+)/g;
// var res = r.exec( str );
var res;
while ( res = r.exec( str ) ) {
console.log(res)
console.log( '邮箱是: ' + res[ 0 ] + ', 用户名: ' + res[ 1 ] + ', 主机名: ' + res[ 2 ] );
}

贪婪模式

凡是在正则表达式中, 涉及到次数限定的, 一般默认都是尽可能的多匹配。

取消贪婪模式. 在次数限定符后面加上 ?。

多个贪婪在一起的时候的强度:第一个最强 后面强度一样。

// 一般模式

/(\d+)(\d+)(\d+)/.exec('1234567');

// '12345','6','7'

// 取消贪婪模式
/(\d+?)(\d+)(\d+)/.exec('1234567'); // '1','23456','7'

用于模式匹配的String方法

String支持4种使用正则表达式的方法。如下:

  • String.prototype.serach(/regExp/g);
  • String.prototype.replace(/regExp/g,'string || $1 || fn');
  • String.prototype.match(/regExp/g)
  • String.prototype.split(/regExp/g)

RegExp对象

RegExp主要方法,exec,test...

常见的用法

1、实现‘123456789123’这样的数字字符串转化为'1,234,567,891'

var str = '123456789123';

str.split('')
.reverse()
.join('')
.replace(/(\d{3})/g,'$1,')
.split('')
.reverse()
.join('')
if(str.startWith(',')) str.slice(1); phoneNum = str;
formatedPhoneNum = phoneNum.replace(/(\d{3,3})/g, "$1\-");
formatedPhoneNum.slice(-1) === "-" && (formatedPhoneNum = formatedPhoneNum.slice(0,-1));

2、组件封装之中用到的模板

实现核心代码:

var regex = /(\{(\w+)\})/g
for (var i = 0, len = data.length; i < len; i++) {
var template = that.ajaxConfig.template.indexOf("%rank%") >=0
? that.ajaxConfig.template.replace("%rank%",(that.pageNum - 1)*ajaxConfig.data.limit + i + 1)
: that.ajaxConfig.template
while (regex.exec(template)) {
template = template.replace(RegExp.$1, data[i][RegExp.$2])
}
}

调用代码

new Scroll(".k_scroll>.scroll-wrap", {
url: "/tuhoKingPapaActivity/userRankList",
data: {
pageNum: 1,
limit: 15
},
template:`<li>
<span class="row-1 fl">%rank%</span>
<span class="row-2 fl">{nickname}</span>
<span class="row-3 fl">{pnum}</span>
</li>`
})

javascript 正则表达式学习的更多相关文章

  1. JavaScript正则表达式学习笔记(二) - 打怪升级

    本文接上篇,基础部分相对薄弱的同学请移步<JavaScript正则表达式学习笔记(一) - 理论基础>.上文介绍了8种JavaScript正则表达式的属性,本文还会追加介绍几种JavaSc ...

  2. javascript正则表达式 - 学习笔记

    JavaScript 正则表达式 学习笔记 标签(空格分隔): 基础 JavaScript 正则表达式是用于匹配字符串中字符组合的模式.在javascript中,正则表达式也是对象.这些模式被用于Re ...

  3. javascript正则表达式学习(二)--位置匹配

    文章首发于sau交流学习社区 一.前言 正则表达式是匹配模式,要么是匹配字符,要么匹配位置. 其实在开发中很少用到匹配位置,本篇文章主要包含: 二.什么是位置 位置:相邻字符之间的位置. 三.如何匹配 ...

  4. javascript 正则表达式学习教程

    正则表达式 就是用某种模式去匹配一类字串的一个公式 RegExp 对象表示正则表达式 Regular Expression 正则表达式是很多程序设计语法都支持的 //①隐式创建 var regexp ...

  5. JavaScript 正则表达式学习笔记

    定义规则让计算机去处理字符串正则表达式写法: //第一种 var reg = new RegExp('ab'); //第二种 var reg = /ab/; 量词:{} [a-z] 从小写a-z [A ...

  6. JavaScript正则表达式学习笔记之一 - 理论基础

    自从年前得空写了两篇文章之后就开始忙了,这一忙就是2个月

  7. 第一百零五节,JavaScript正则表达式

    JavaScript正则表达式 学习要点: 1.什么是正则表达式 2.创建正则表达式 3.获取控制 4.常用的正则 假设用户需要在HTML表单中填写姓名.地址.出生日期等.那么在将表单提交到服务器进一 ...

  8. 深入浅出的javascript的正则表达式学习教程

    深入浅出的javascript的正则表达式学习教程 阅读目录 了解正则表达式的方法 了解正则中的普通字符 了解正则中的方括号[]的含义 理解javascript中的元字符 RegExp特殊字符中的需要 ...

  9. 正则表达式(javascript)学习总结

    正则表达式在jquery.linux等随处可见,已经无孔不入.因此有必要对这个工具认真的学习一番.本着认真.严谨的态度,这次总结我花了近一个月的时间.但本文无任何创新之处,属一般性学习总结. 一.思考 ...

随机推荐

  1. Quartz.NET的简单任务管理类

    昨天使用Quartz.NET做了个定时任务的功能,并实现了多个定时任务的功能 下面这个类实现了如下功能: 1.对定时任务进行管理 2.创建定时任务,需要给定时任务一个job的名称 3.判断给定的job ...

  2. C# 元数据描述

    元数据概述:元数据是一种二进制信息,用以对存储在公共语言运行库可移植可执行文件 (PE) 文件或存储在内存中的程序进行描述.将您的代码编译为 PE 文件时,便会将元数据插入到该文件的一部分中,而将代码 ...

  3. Django之stark组件

    现在让我说啥是stark组件,我也说不清楚.反正从今天讲的知识来看,今天完成的就是自己写一个模块,这个模块包含了admin后台管理工具的一些比较好用的功能,我们把它提炼出来,也就是相当于自己写一个ad ...

  4. C#.net使用DotNetCharting控件生成报表统计图

    在做项目时要对数据进行统计分析,所以必须生成一些报表统计图(如柱形图.饼图.曲线图等),网上强烈推荐了使用DotNetCharting控件来实现,于是自己对DotNetCharting控件进行了简单的 ...

  5. java中的序列化

    遇到这个 Java Serializable 序列化这个接口,我们可能会有如下的问题 a,什么叫序列化和反序列化b,作用.为啥要实现这个 Serializable 接口,也就是为啥要序列化c,seri ...

  6. MySQL学习(四) SQL连接查询

    更多情况下,我们查询的数据来源于多张表,所有有必要了解一下MySQL中的连接查询. SQL中将连接查询分成四类:交叉连接,内连接,外连接和自然连接. 数据准备 student表 -- -------- ...

  7. 4.移植uboot-使uboot支持DM9000网卡

    在上一章,使uboot能够支持nor.nand 本节继续修改让uboot支持DM9000C网卡,便可以通过网络来传输文件 首先uboot已带有dm9000网卡的驱动,位于drivers/net/下的d ...

  8. Java8的lambda表达式和Stream API

    一直在用JDK8 ,却从未用过Stream,为了对数组或集合进行一些排序.过滤或数据处理,只会写for循环或者foreach,这就是我曾经的一个写照. 刚开始写写是打基础,但写的多了,各种乏味,非过来 ...

  9. 去除input获取光标时的默认样式

    给input加上样式   outline:none;

  10. java.io.IOException No space left on device

    磁盘空间不足 1.df -k,发现程序所在的工作目录/data,居然到了100%. 1604050 free allocated Kb 535144219 used allocated Kb 100 ...