详解JavaScript中的正则表达式
实际工作中,JavaScript正则表达式还是经常用到的。所以这部分的知识是非常重要的。
一、基础语法:
第一种:字面量语法
var expression=/pattern/flags;
第二种:RegExp构造函数语法
var pattern = /\w/gi; //字面量语法
var pattern = new RegExp('\\w', 'gi');//构造函数语法,这两者是等价的
这里有个注意点就是:如果正则表达式是动态的话,只能选择第二种。
其中的flags有3个标志
g:表示全局模式,即模式将被应用于所有字符串,而非在发现第一个匹配项时立即停止;
i:表示不区分大小写模式,即在确定匹配项时忽略模式与字符串的大小写;
m:表示多行模式,即在到达一行文本末尾时还会继续查找下一行中是否存在与模式匹配的项。
当然还有其他的flags,用到的极少,不做过多阐述。
至于以上的\w什么意思,稍等,请继续往下看。
二、方法
主要有test(),search(),match(),replace()。当然还有其它的很多方法,不作阐述,毕竟用到的很少。
1、test()方法的使用
判断某个字符串中是否含有相应的字符串
2、search()方法的使用
搜索相应的字符串第一次出现的索引位置,如果未找到,则返回-1
3、match()方法的使用
返回匹配的数组
4、replace()方法的使用,这个用到的还是非常多的
匹配相应的字符串,然后将其替换成其他字符串
三、匹配表达式跟实战
1、断言:
所谓的断言呢,就是表示一个匹配在某些条件下发生。总之呢,概念有点绕,直接看下文。待我慢慢续来。
字符 | 描述 |
---|---|
^ | 匹配开头 |
$ | 匹配结尾 |
\b | 匹配单词的边界 |
\B | 匹配非单词的边界 |
举个例子
我要匹配一个字符串,开头到结尾是dog,忽略大小写
var pattern = /^dog$/i;//忽略大小写
console.log(pattern.test('dog'));//true
console.log(pattern.test('sdfdog'));//false
console.log(pattern.test('dog56'));//false
console.log(pattern.test('dOG'));//true
var pattern = /\b\w+/g;//全局匹配,这里的+,是量词,代表1次或者多次
console.log('Hello World'.match(pattern));//输出['Hello','World'],这里就是match用法,返回匹配的数组。
在这里,说下,\b是匹配单词的边界,那么\B是匹配非单词的边界。一个小写,一个大写,大写是反义。那么不必我多说了吧。
再说下单词边界,可能很多人都不太清楚单词边界
我稍微解释下啊,比如说,Hello World单词边界有四个,分别是H位置,o位置,W位置,d位置
2、字符类:
元字符 | 描述 |
---|---|
. | 查找单个字符,除了换行和行结束符 |
\w | 查找单词字符,相当于[A-Za-z0-9_] |
\W | 查找非单词字符,相当于[^A-Za-z0-9_] |
下面的反义便不再罗列出来了。 | |
\d | 查找数字,相当于[0-9] |
\s | 查找空白字符 |
\0 | 查找NULL字符 |
\n | 查找换行符 |
\f | 查找换页符 |
\r | 查找回车符 |
\t | 查找制表符 |
\v | 查找垂直制表符 |
3、范围:
字符 | 描述 |
---|---|
[abc] | 匹配a,b,c中的任意一个字符 |
[^abc] | 匹配不是a,b,c中的任意一个字符 |
[0-9] | 匹配0-9任意范围的数字,同理[a-z]匹配a-z任意范围的字符 |
[a-z] | 匹配a到z之间的任意一个字符 |
x|y | 匹配x或者y |
4、量词:
字符 | 描述 |
---|---|
n+ | 匹配任何包含至少一个字符n的字符串 |
n* | 匹配任何包含零个或多个n的字符串 |
n? | 匹配任何包含零个或者一个n的字符串 |
n{x} | 匹配包含x个n的字符串 |
n{x,y} | 匹配最少x个,最多y个n的字符串 |
四、拓展
匹配10-36之间的数字
var pattern = /1[2-9]|[2-3][0-9]|4[0-6]/;//12-46
console.log(pattern.test(11));//false
console.log(pattern.test(12));//true
console.log(pattern.test(20));//true
console.log(pattern.test(36));//true
console.log(pattern.test(46));//true
console.log(pattern.test(47));//false
将'Hello,World!Hello'中的Hello替换成Welcome
这里主要是强调一下replace方法在正则中的使用,因为这个在实际中用到的还是非常多的。后面的flags中的g,加上跟不加上有着很大的区别的。
var pattern = /Hello/g;
var oldString = 'Hello,World!Hello';
var newString = oldString.replace(pattern, 'Welcome');
console.log(newString);//Welcome,World!Welcome
详解JavaScript中的正则表达式的更多相关文章
- 【转】详解JavaScript中的this
ref:http://blog.jobbole.com/39305/ 来源:foocoder 详解JavaScript中的this JavaScript中的this总是让人迷惑,应该是js众所周知的坑 ...
- 详解 javascript中offsetleft属性的用法(转)
详解 javascript中offsetleft属性的用法 转载 2015-11-11 投稿:mrr 我要评论 本章节通过代码实例介绍一下offsetleft属性的用法,需要的朋友可以做一 ...
- 详解javascript中的this对象
详解javascript中的this对象 前言 Javascript是一门基于对象的动态语言,也就是说,所有东西都是对象,一个很典型的例子就是函数也被视为普通的对象.Javascript可以通过一定的 ...
- (转载)详解Javascript中prototype属性(推荐)
在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例.但是在Javascript语言体系中,是不存在类(Class)的概念的,javascript中不 ...
- 详解Javascript中正则表达式的使用
正则表达式用来处理字符串特别好用,在JavaScript中能用到正则表达式的地方有很多,本文对正则表达式基础知识和Javascript中正则表达式的使用做一个总结. 第一部分简单列举了正则表达式在Ja ...
- 详解JavaScript中的原型
前言 原型.原型链应该是被大多数前端er说烂的词,但是应该还有很多人不能完整的解释这两个内容,当然也包括我自己. 最早一篇原型链文章写于2019年07月,那个时候也是费了老大劲才理解到了七八成,到现在 ...
- 【转】详解JavaScript中的异常处理方法
有三种类型的编程错误:(1)语法错误和(2)运行时错误(3)逻辑错误:语法错误: 语法错误,也被称为解析错误,在编译时进行传统的编程语言,并出现在JavaScript解释时. 例如,下面一行将导致一个 ...
- 详解JavaScript中的Event Loop(事件循环)机制
前言 我们都知道,javascript从诞生之日起就是一门单线程的非阻塞的脚本语言.这是由其最初的用途来决定的:与浏览器交互. 单线程意味着,javascript代码在执行的任何时候,都只有一个主线程 ...
- 详解JavaScript中的arc的方法
今天说说JavaScript在网页中画圆的函数arc! 一.arc所需要的参数设置 1 arc(x, y, radius, startAngle, endAngle, counterclockwise ...
随机推荐
- python中yield的用法详解——最简单,最清晰的解释
转载自https://blog.csdn.net/mieleizhi0522 首先我要吐槽一下,看程序的过程中遇见了yield这个关键字,然后百度的时候,发现没有一个能简单的让我懂的,讲起来真TM的都 ...
- Google单元测试框架gtest--值参数测试
测试一个方法,需要较多个参数进行测试,比如最大值.最小值.异常值和正常值.这中间会有较多重复代码工作,而值参数测试就是避免这种重复性工作,并且不会损失测试的便利性和准确性. 如果测试一个函数,需要些各 ...
- Android中Context样式分析
目录 1.样式定义以及使用 1.1.默认样式 1.2.样式定义及使用 1.3.当前样式下attr属性的获取 1.4.属性集合的定义与获取 2.Activity中Theme的初始化流程 2.1.系统调用 ...
- springboot源码解析-管中窥豹系列之自动装配(九)
一.前言 Springboot源码解析是一件大工程,逐行逐句的去研究代码,会很枯燥,也不容易坚持下去. 我们不追求大而全,而是试着每次去研究一个小知识点,最终聚沙成塔,这就是我们的springboot ...
- 理解ASP.NET Core 中的WebSocket
在本文中,我们将详细介绍RFC 6455 WebSocket规范,并配置一个通用的.NET 5应用程序通过WebSocket连接与SignalR通信. 我们将深入底层的概念,以理解底层发生了什么. 关 ...
- let、const、var区别?
let.const.var区别? let和const不存在变量提升(没有预解析,var有预解析). let和const在同一作用域范围内不能重复定义变量.(var可以). let和const有严格的作 ...
- JS table排序
<html lang="en"> <head> <meta charset="UTF-8"> <meta http-e ...
- vue Element-ui el-menu 左侧导航条
<template> <!--实现左侧导航条动态渲染(三级)--> <el-menu class="el-menu-vertical-demo" @o ...
- Codeforces Round #558 B2. Cat Party (Hard Edition)
题面: 传送门 题目描述: 题意:确定最大的x,使去除掉前x天的其中一天后,所有不同数字的数量相等. 题目分析: 可能是我太久没打cf了,水题都做不出来. 这道题的关键在于:要记录相同数量,的不同 ...
- 07、列表list
列表(list) 是一个有序且可变的容器,在里面可以存放多个不同类型的元素 list = ['阿斯顿','阿发师','收发室'] list = [98,88,66,-1] list = [1,True ...