备案控制台
开发者社区 开发与运维 文章 正文

js - 正则表达式

2023-09-27 44
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： js - 正则表达式

正则表达式概述

正确的规则

  1. 什么是正则表达式？

检测字符串的一组规则。

  1. 正则表达式的作用？

主要用于表单验证 处理复杂的字符串。

如何声明正则表达式？

  1. 字面量方式：

/正则表达式/标志位

  1. 构造函数方式：

new RegExp('正则表达式','标志位')

正则表达式的方法？

  1. 正则表达式.test(字符串) : 检测字符串中是否包含了正则的内容，如果包含了，则返回true,否则，返回false.
  2. 正则表达式.exec(字符串) : 将字符串中匹配到正则的内容以数组的方式返回。如果没有匹配的内容，返回null

处理正则表达式的字符串方法？

  1. 字符串.match(正则) : 将字符串中匹配到正则的内容以数组的方式返回。如果没有匹配的内容，返回null
  2. 字符串.search(正则) : 与indexOf的功能相同，查找正则匹配的内容在父串中第一次出现的下标位置 ，如果没有找到，返回 -1
var re = /de/;
var str = 'how do you do';
console.log(str.search(re)); //-1

exec与match的区别：

//1. 无g无组的情况
var re = /do/;
var str = 'how do you do';
console.log(re.exec(str)); //['do']
console.log(str.match(re)); //['do']
​
//2. 有g无组的情况
var re = /do/g;
var str = 'how do you do';
console.log(re.exec(str)); //['do']
console.log(str.match(re)); //['do','do']
​
//3. 无g有组的情况
var re = /([a-z]+) (\d+)/;
var str = 'haha 2022';
console.log(re.exec(str)); //['haha 2022','haha','2022']
console.log(str.match(re)); //['haha 2022','haha','2022']
​
//3. 有g有组的情况
var re = /([a-z]+) (\d+)/g;
var str = 'haha 2022,hehe 2023';
console.log(re.exec(str)); //['haha 2022','haha','2022']
console.log(str.match(re)); //['haha 2022', 'hehe 2023']

正则表达式的元字符 (三、三、二、三个一)

三： {} [] ()

  1. {} : 表示{}前面的一个或一组字符连续出现的次数。
  2. {m} : 表示{}前面的一个或一组字符连续出现 m 次
  3. var str = 'ooo';

var re = /^o{3}开头必须是/;//开头必须是o/; // ^开头必须是o  结尾必须是o

console.log(re.test(str)); //true

{m,} : 表示{}前面的一个或一组字符连续出现 m 至 无限次，至少出现m次

var str = 'ooooooooooooooooooooo';

var re = /^o{3,}$/;

console.log(re.test(str)); //true

  1. * : 表示*号前面的一个或一组字符连续出现 0 至 无限次 {0,}

var str = 'oooo';

var re = /^o{3,5}$/;

console.log(re.test(str)); //true

  1. + : 表示+号前面的一个或一组字符连续出现 1 至 无限次 {1,}

var re = /^do+$/

var str = 'doooooooooooo';

console.log(re.test(str));

  1. ? : 表示？号前面的一个或一组字符连续出现 0 至 1 次 {0,1}


var re = /^do?$/

var str = 'd';

console.log(re.test(str));

^ $

  1. ^

写在正则表达式的开头，表示断头，限制字符串的开头必须是指定的字符。 写在[]的开头，表示取反

var re = /^[^0-9]+/
var str = 'd45678';
console.log(re.test(str));
var re = /^[^0-9]+$/
var str = 'd!@#$%';
console.log(re.test(str));
  1. $

表示断尾，限制字符串的结尾必须是指定的字符。

var re = /!$/
var str = 'How do you do!';
console.log(re.test(str));

三个一 ： . | \

  1. . : 表示模糊匹配任意一个字符。
var re = /^h.*w$/;
var str = 'h2345r6t7y8uiokjfder56789iokw';
console.log(re.test(str));

| : 表示或,一般结合组一起使用。

var re = /^h.*w$/;
var str = 'h2345r6t7y8uiokjfder56789iokw';
console.log(re.test(str));

\ : 表示转义符，将具有特殊含义的符号转为普通字符。

//文件类型（后缀）（扩展名）  .html   .js   .css   .mp4  .c   
var re = /\.[a-zA-Z0-9]{1,4}$/;
var str = 'index.html';
console.log(re.test(str));

\d : 表示数字 [0-9]

//邮政编码
var re = /^\d{6}$/;
var str = '034017';
console.log(re.test(str));
//手机号
var re = /^1(1|2|3|4|5|6|7|8|9)\d{9}$/;
var str = '17710875717';
console.log(re.test(str));
// 2022/7/20
var re = /^(\d{4}|\d{2})\/\d{1,2}\/\d{1,2}$/;
var  str = '22/7/20';
console.log(re.test(str));

\D : 表示非数字 [^0-9] \w : 表示字母、数字、下划线 [a-zA-Z_]

//京东密码规则
var re = /^\w{8,16}$/;
var str = 'abc_12345678';
console.log(re.test(str));

\W : 表示 非（字母、数字、下划线） \s : 表示空白 \S : 表示非空白 \b : 表示单词边界 \B : 表示非边界

正则表达式的标志位

  1. g : 全局匹配,匹配出所有的匹配项，并非在发现第一个匹配项时就立即停止
  2. i : 不区分大小写字母
  3. m: 表示多行模式（multiline）,可以进行多行匹配，但是只有使用^和$模式时才起作用，在其他模式中，加不加入m都可以进行多行匹配

案例分析

var pattern = /(google){4,8}/; 
var str = 'googlegoogle'; 
alert(pattern.test(str));
```flase
```js
var pattern = /(google|baidu|bing)/; 
var str = 'google'; 
alert(pattern.test(str));
var pattern = /goo\sgle/; 
var str = 'goo gle'; 
alert(pattern.test(str));
var pattern = /google\b/; 
var str = 'google'; 
var str2= 'googleaa googlexx google dsdddd'; 
alert(pattern.test(str));
alert(pattern.test(str2));
var pattern = /g\w*gle/; 
var str = 'google'; 
alert(pattern.test(str));
var pattern = /google\d*/; 
var str = 'google444';
alert(pattern.test(str));
var pattern = /\D{7,}/; 
var str = 'google8'; 
alert(pattern.test(str));
var pattern = /g[a-zA-Z_]*gle/; 
var str = 'google'; 
alert(pattern.test(str));
var pattern = /g[^0-9]*gle/; 
var str = 'google'; 
alert(pattern.test(str));
var pattern = /[a-z][A-Z]+/; 
var str = 'gOOGLE'; 
alert(pattern.test(str));
var pattern = /g.*gle/; 
var str = 'google'; 
alert(pattern.test(str));
var pattern = /^[a-z]+\s[0-9]{4}$/i; 
var str = 'google 2012'; 
alert(pattern.exec(str));  
var pattern = /^[a-z]+/i; 
var str = 'google 2012'; 
alert(pattern.exec(str));
var pattern = /^([a-z]+)\s([0-9]{4})$/i; 
var str = 'google 2012'; 
alert(pattern.exec(str)[0]); 
alert(pattern.exec(str)[1]); 
alert(pattern.exec(str)[2]);
var pattern = /Good/ig; 
var str = “good good study!,day day up!”; 
alert(str.replace(pattern,’hard’));
var pattern = /(.*)\s(.*)/; 
var str = 'google baidu'; 
var result = str.replace(pattern, '$2 $1'); 
document.write(result)
var pattern = /8(.*)8/; 
var str = 'This is 8google8'; 
var result = str.replace(pattern,'<strong>$1</strong>'); 
document.write(result);
Var pattern = /good/ig; 
var str = ‘good good study!,day day up!’;
alert(str.match(pattern)); 
alert(str.match(pattern).length);
var pattern = /8(.*)8/; 
var str = 'This is 8google8, dd 8ggg8'; 
alert(str.match(pattern));  
alert(RegExp.$1);
var pattern = /good/ig; 
var str = ‘good good study!,day day up!’; 
alert(str.search(pattern));
文章标签：
JavaScript
关键词：
正则表达式js
JavaScript正则表达式
秃头请走开
目录
相关文章
穆雄雄.
|
2月前
|
移动开发 JavaScript 前端开发
JavaScript的正则表达式实现邮箱校验
JavaScript的正则表达式实现邮箱校验
穆雄雄.
59 1
我是夜阑的狗
|
2月前
|
JavaScript 前端开发
JavaScript随手笔记 --- 用正则表达式匹配字符串是否为运算公式
JavaScript随手笔记 --- 用正则表达式匹配字符串是否为运算公式
我是夜阑的狗
22 0
低代码布道师
|
2月前
|
JavaScript 前端开发
javascript中的正则表达式
javascript中的正则表达式
低代码布道师
14 0
多加点香菜85
|
3月前
|
JavaScript 前端开发
JavaScript中的正则表达式构造函数和正则表达式字面量
JavaScript中的正则表达式构造函数和正则表达式字面量
多加点香菜85
16 0
爱吃糖的范同学
|
4月前
|
JavaScript 前端开发 API
【JavaScript】＜正则表达式Regular Expression＞JavaScript正则表达式解析
【1月更文挑战第17天】【JavaScript】＜正则表达式Regular Expression＞JavaScript正则表达式解析
爱吃糖的范同学
32 1
贰零壹玖.
|
5月前
|
前端开发 JavaScript
前端JavaScript入门-day08-正则表达式
前端JavaScript入门-day08-正则表达式
贰零壹玖.
37 0
流烟默
|
5月前
|
机器学习/深度学习 存储 JavaScript
正则表达式基础语法与Java、JS使用实例
正则表达式基础语法与Java、JS使用实例
流烟默
73 1
yma16
|
14天前
|
JavaScript 索引
记录_js正则表达式
记录_js正则表达式
yma16
6 0
wljslmz
|
2月前
|
监控 JavaScript 前端开发
JavaScript 正则表达式详解
【2月更文挑战第26天】
wljslmz
36 1
JavaScript 正则表达式详解
那维莱特
|
4月前
|
JavaScript
js如何去实现用正则表达式来判断一个值
js如何去实现用正则表达式来判断一个值
那维莱特
14 0

热门文章

最新文章

  • 1
    JavaScript 权威指南第七版（GPT 重译）（六）(4)
  • 2
    JavaScript 权威指南第七版（GPT 重译）（三）(1)
  • 3
    JavaScript 权威指南第七版（GPT 重译）（二）(1)
  • 4
    JavaScript 权威指南第七版（GPT 重译）（四）(4)
  • 5
    JavaScript 权威指南第七版（GPT 重译）（七）(1)
  • 6
    JavaScript 权威指南第七版（GPT 重译）（六）(3)
  • 7
    JavaScript 权威指南第七版（GPT 重译）（三）(2)
  • 8
    报错/ ./node_modules/axios/lib/platform/index.js Module parse failed: Unexpected token (5:2)怎么解决？
  • 9
    设置WebStorm像VSCode一样每行代码结尾自动格式化加入“；”分号（JavaScript、TypeScript格式化）
  • 10
    前端最常见的JS面试题大全
  • 1
    JavaScript随手笔记 --- 用正则表达式匹配字符串是否为运算公式
    22
  • 2
    Java 异常处理与正则表达式详解，实例演练及最佳实践
    46
  • 3
    正则表达式中的否定字符集
    20
  • 4
    正则表达式中的字符集范围
    23
  • 5
    正则表达式中的字符集
    18
  • 6
    sed删除匹配正则表达式的行
    52
  • 7
    sed删除不匹配正则表达式的行（保留匹配行）
    88
  • 8
    使用awk和正则表达式过滤文本或字符串 - 详细指南和示例
    78
  • 9
    grep正则表达式搜索
    17
  • 10
    正则表达式
    31

    • 相关课程

    更多
  • Linux文本处理、正则表达式与Vim
  • JavaScript入门与实战
  • JavaScript 自学手册文档教程
  • Vue.js 入门与实战
  • Node.js 入门教程文档

    • 相关电子书

    更多
  • JavaScript函数
  • Delivering Javascript to World
  • 编程语言如何演化-以JS的private为例

    • 相关实验场景

    更多
  • Html5和Webpack2：Webpack5打包JS和样式表
  • 前端开发基础6：Node.js和LESS预编译工具
    • 下一篇
    部署LAMP环境（Alibaba Cloud Linux 3）