JS基础-正则
正则表达式
创建正则表达式
- 使用一个正则表达式字面量
const regex = /^[a-zA-Z]+[0-9]*\W?_$/gi;
- 调用RegExp对象的构造函数
const regex = new RegExp(pattern, [, flags])
特殊字符
- ^ 匹配输入的开始
- $ 匹配输入的结束
- * 0次或多次 {0,}
- + 1次或多次 {1,}
- ?
- 0次或者1次 {0,1}。
- 用于先行断言
- 如果紧跟在任何量词 *、 +、? 或 {} 的后面,将会使量词变为非贪婪
- 对 "123abc" 用 /\d+/ 将会返回 "123",
- 用 /\d+?/,那么就只会匹配到 "1"。
- . 匹配除换行符之外的任何单个字符
- (x) 匹配 'x' 并且记住匹配项
- (?:x) 匹配 'x' 但是不记住匹配项
- x(?=y) 配'x'仅仅当'x'后面跟着'y'.这种叫做正向肯定查找。
- x(?!y) 匹配'x'仅仅当'x'后面不跟着'y',这个叫做正向否定查找。
- x|y 匹配‘x’或者‘y’。
- {n} 重复n次
- {n, m} 匹配至少n次,最多m次
- [xyz] 代表 x 或 y 或 z
- [^xyz] 不是 x 或 y 或 z
- \d 数字
- \D 非数字
- \s 空白字符,包括空格、制表符、换页符和换行符。
- \S 非空白字符
- \w 单词字符(字母、数字或者下划线) [A-Za-z0-9_]
- \W 非单字字符。[^A-Za-z0-9_]
- \3 表示第三个分组
- \b 词的边界
- /\bm/匹配“moon”中得‘m’;
- \B 非单词边界
使用正则表达式的方法
- exec 一个在字符串中执行查找匹配的RegExp方法,它返回一个数组(未匹配到则返回null)。
- test 一个在字符串中测试是否匹配的RegExp方法,它返回true或false。
- match 一个在字符串中执行查找匹配的String方法,它返回一个数组或者在未匹配到时返回null。
- search 一个在字符串中测试匹配的String方法,它返回匹配到的位置索引,或者在失败时返回-1。
- replace 一个在字符串中执行查找匹配的String方法,并且使用替换字符串替换掉匹配到的子字符串。
- split 一个使用正则表达式或者一个固定字符串分隔一个字符串,并将分隔后的子字符串存储到数组中的String方法。
练习
匹配结尾的数字
/\d+$/g
统一空格个数
字符串内如有空格,但是空格的数量可能不一致,通过正则将空格的个数统一变为一个。
let reg = /\s+/g
str.replace(reg, " ");
判断字符串是不是由数字组成
str.test(/^\d+$/);
电话号码正则
- 区号必填为3-4位的数字
- 区号之后用“-”与电话号码连接电话号码为7-8位的数字
- 分机号码为3-4位的数字,非必填,但若填写则以“-”与电话号码相连接
/^\d{3,4}-\d{7,8}(-\d{3,4})?$/
手机号码正则表达式
正则验证手机号,忽略前面的0,支持130-139,150-159。忽略前面0之后判断它是11位的。
/^0*1(3|5)\d{9}$/
使用正则表达式实现删除字符串中的空格
funtion trim(str) {
let reg = /^\s+|\s+$/g
return str.replace(reg, '');
}
限制文本框只能输入数字和两位小数点等等
/^\d*\.\d{0,2}$/
只能输入小写的英文字母和小数点,和冒号,正反斜杠(:./)
/^[a-z\.:\/\\]*$/
替换小数点前内容为指定内容
例如:infomarket.php?id=197 替换为 test.php?id=197
var reg = /^[^\.]+/;
var target = '---------';
str = str.replace(reg, target)
只匹配中文的正则表达式
/[\u4E00-\u9FA5\uf900-\ufa2d]/ig
返回字符串的中文字符个数
先去掉非中文字符,再返回length属性。
function cLength(str){
var reg = /[^\u4E00-\u9FA5\uf900-\ufa2d]/g;
//匹配非中文的正则表达式
var temp = str.replace(reg,'');
return temp.length;
}
正则表达式取得匹配IP地址前三段
只要匹配掉最后一段并且替换为空字符串就行了
function getPreThrstr(str) {
let reg = /\.\d{1,3}$/;
return str.replace(reg,'');
}
匹配
- 与
之间的内容
/<ul>[\s\S]+?</ul>/i
用正则表达式获得文件名
c:\images\tupian\006.jpg
可能是直接在盘符根目录下,也可能在好几层目录下,要求替换到只剩文件名。
首先匹配非左右斜线字符0或多个,然后是左右斜线一个或者多个。
function getFileName(str){
var reg = /[^\\\/]*[\\\/]+/g;
// xxx\ 或是 xxx/
str = str.replace(reg,'');
return str;
}
绝对路径变相对路径
"http://23.123.22.12/image/somepic.gif"转换为:"/image/somepic.gif"
var reg = /http:\/\/[^\/]+/;
str = str.replace(reg,"");
用户名正则
用于用户名注册,,用户名只 能用 中文、英文、数字、下划线、4-16个字符。
/^[\u4E00-\u9FA5\uf900-\ufa2d\w]{4,16}$/
匹配英文地址
规则如下:
包含 "点", "字母","空格","逗号","数字",但开头和结尾不能是除字母外任何字符。
/^[a-zA-Z][\.a-zA-Z,0-9]*[a-zA-Z]$/
正则匹配价格
开头数字若干位,可能有一个小数点,小数点后面可以有两位数字。
/^\d+(\.\d{2})?$/
身份证号码的匹配
身份证号码可以是15位或者是18位,其中最后一位可以是X。其它全是数字
/^(\d{14}|\d{17})(X|x)$/
单词首字母大写
每单词首字大写,其他小写。如blue idea转换为Blue Idea,BLUE IDEA也转换为Blue Idea
function firstCharUpper(str) {
str = str.toLowerCase();
let reg = /\b(\w)/g;
return str.replace(reg, m => m.toUpperCase());
}
正则验证日期格式
yyyy-mm-dd格式
4位数字,横线,1或者2位数字,再横线,最后又是1或者2位数字。
/^\d{4}-\d{1,2}-\d{1,2}$/
去掉文件的后缀名
www.abc.com/dc/fda.asp 变为 www.abc.com/dc/fda
function removeExp(str) {
return str.replace(/\.\w$/,'')
}
验证邮箱的正则表达式
开始必须是一个或者多个单词字符或者是-,加上@,然后又是一个或者多个单词字符或者是-。然后是点“.”和单词字符和-的组合,可以有一个或者
多个组合。
/^[\w-]+@\w+\.\w+$/
正则判断标签是否闭合
例如:<img xxx=”xxx” 就是没有闭合的标签;
p的内容,同样也是没闭合的标签。
标签可能有两种方式闭合, 或者是
xxx
。
/<([a-z]+)(\s*\w*?\s*=\s*".+?")*(\s*?>[\s\S]*?(<\/\1>)+|\s*\/>)/i
正则判断是否为数字与字母的混合
不能小于12位,且必须为字母和数字的混
/^(([a-z]+[0-9]+)|([0-9]+[a-z]+))[a-z0-9]*$/i
将阿拉伯数字替换为中文大写形式
function replaceReg(reg,str){
let arr=["零","壹","贰","叁","肆","伍","陆","柒","捌","玖"];
let reg = /\d/g;
return str.replace(reg,function(m){return arr[m];})
}
去掉标签的所有属性
变成没有任何属性的
思路:非捕获匹配属性,捕获匹配标签,使用捕获结果替换掉字符串。正则如下:
```js
/(
```
JS基础-正则的更多相关文章
- [JS复习] JS 基础知识
项目结尾,空闲时间,又把<JS 基础知识> 这本书过了一遍,温故知新后,很多知其然不知其所以然的内容 豁然开朗. [1. 用于范围的标签] display :inline or bloc ...
- JS基础--函数与BOM、DOM操作、JS中的事件以及内置对象
前 言 絮叨絮叨 这里是JS基础知识集中讲解的第三篇,也是最后一篇,三篇JS的基础,大多是知识的罗列,并没有涉及更难得东西,干货满满!看完这一篇后,相信许多正在像我一样正处于初级阶段的同学, ...
- js基础查漏补缺(更新)
js基础查漏补缺: 1. NaN != NaN: 复制数组可以用slice: 数组的sort.reverse等方法都会改变自身: Map是一组键值对的结构,Set是key的集合: Array.Map. ...
- 前端面试题目汇总摘录(JS 基础篇)
JS 基础 JavaScript 的 typeof 返回那些数据类型 object number function boolean undefined string typeof null; // o ...
- day51 JS基础
复习 1.字体图标 用i标签, 设置类名, 与第三方字体图标库进行图标匹配 <link rel="stylesheet" href="font-awesome-4. ...
- 10慕课网《进击Node.js基础(一)》初识promise
首先用最简单的方式实现一个动画效果 <!doctype> <html> <head> <title>Promise animation</titl ...
- 前端面试题目汇总摘录(JS 基础篇 —— 2018.11.02更新)
温故而知新,保持空杯心态 JS 基础 JavaScript 的 typeof 返回那些数据类型 object number function boolean undefined string type ...
- js基础 js自执行函数、调用递归函数、圆括号运算符、函数声明的提升 js 布尔值 ASP.NET MVC中设置跨域
js基础 目录 javascript基础 ESMAScript数据类型 DOM JS常用方法 回到顶部 javascript基础 常说的js包括三个部分:dom(文档document).bom(浏览器 ...
- JS基础-全方面掌握继承
前言 上篇文章详细解析了原型.原型链的相关知识点,这篇文章讲的是和原型链有密切关联的继承,它是前端基础中很重要的一个知识点,它对于代码复用来说非常有用,本篇将详细解析JS中的各种继承方式和优缺点进行, ...
随机推荐
- pat 1008 Elevator(20 分)
1008 Elevator(20 分) The highest building in our city has only one elevator. A request list is made u ...
- SpringBoot 源码解析 (七)----- Spring Boot的核心能力 - 自定义Servlet、Filter、Listener是如何注册到Tomcat容器中的?(SpringBoot实现SpringMvc的原理)
上一篇我们讲了SpringBoot中Tomcat的启动过程,本篇我们接着讲在SpringBoot中如何向Tomcat中添加Servlet.Filter.Listener 自定义Servlet.Filt ...
- mysql定时任务(event事件)
1.event事件 事件(event)是MySQL在相应的时刻调用的过程式数据库对象.一个事件可调用一次,也可周期性的启动,它由一个特定的线程来管理的,也就是所谓的“事件调度器” 事件和触发器类似,都 ...
- 神奇的 SQL 之 MySQL 性能分析神器 → EXPLAIN,SQL 起飞的基石!
前言 开心一刻 某人养了一头猪,烦了想放生,可是猪认识回家的路,放生几次它都自己回来了.一日,这个人想了个狠办法,开车带着猪转了好多路进山区放生,放生后又各种打转,然后掏出电话给家里人打了个电话,问道 ...
- Redis报错: StackExchange.Redis.RedisServerException: Endpoint 39.105.22.111:7200 serving hashslot 12448 is not reachable at this point of time.
emmmm……要下班了,简单记录一下. 如果是127.0.0.1:7200报这个错,请移步 https://blog.csdn.net/foreverhot1019/article/details/7 ...
- 【Luogu P1967】货车运输
Luogu P1967 题目大意:给定一张图和q个询问,询问x节点和y节点的路径之间最小边权最大可以是多少. 可以发现对于一条边\(E(x,y)\),如果x到y有另一条路径且最小边权大于\(E(x,y ...
- Theano at a Glance
Theano一览 Theano是一个Python库,它允许你定义.优化和求值数学表达式,特别是具有多维数组(numpy.ndarray)的数学表达式.对于涉及大量数据的问题,使用Theano可以获得与 ...
- 数据降维-NMF非负矩阵分解
1.什么是非负矩阵分解? NMF的基本思想可以简单描述为:对于任意给定的一个非负矩阵V,NMF算法能够寻找到一个非负矩阵W和一个非负矩阵H,使得满足 ,从而将一个非负的矩阵分解为左右两个非负矩阵的乘积 ...
- cookie、session、token的区别
一. cookie 1.什么是cookie? Cookie 技术产生源于 HTTP 协议在互联网上的急速发展.随着互联网时代的策马奔腾,带宽等限制不存在了,人们需要更复杂的互联网交互活动,就必须同服 ...
- 原生js删除增加修改class属性
其实html5已经扩展了class操作的相关API,其中classList属性就以及实现了class的增删和判断. HTML DOM classList 属性 classList属性的方法有: add ...