正则replace 回调函数里接收的参数是什么?
前言
我们都知道 replace 在做替换处理方面会很常用,通常也是第一个会想到的方法。replace 第一个参数可以传入 string 或 RegExp,第二个参数可以传入 string 或 一个回调函数。在能够传入回调函数之后,事情就开始变得不简单了(如果有用过map,filter等函数,你就知道传入回调函数的强大)。在做替换处理时,我们能够获取到更多的有效信息,处理的手段也可以更加多样化,而不是单纯的替换。接下来我们,来看看回调函数里接受的参数到底是什么?
回调中接收到的参数
回调中最少可以接受到3个参数,最多没有上限,为什么这么说呢?往下看

解释可能有点官方,我来简述对应的参数吧(我感觉应该都能看懂吧)
看得多,不如动手敲一敲,先看一个例子:
let str = 'aavbbvcc'
let reg = /(b)+/g
str.replace(reg, ($0,$1,$2,$3)=>{
console.log($0,$1,$2,$3)
})
//bb b 3 aavbbvcc
$0: 正则匹配到的字符串
$1: 在使用组匹配时,组匹配到的值
$2: 匹配值在原字符串中的索引
$3: 原字符串
诶,你刚刚不是说最少3个参数吗?出现3个参数的情况是什么
再来看一个例子:
let str = 'aavbbvcc'
let reg = /b+/g
str.replace(reg, ($0,$1,$2,$3)=>{
console.log($0,$1,$2,$3)
})
//bb 3 aavbbvcc undefined
这次我没有使用组匹配,所以对应的组匹配的值也不会出来
至于最多的参数,就要看你组匹配能匹配到多少个咯
replace的应用
在知道了这些参数后,我们就可以根据实际需求进行使用
假如现在有一个需求:过滤脏话,将脏话替换成对应长度的星号
let str = '菜鸡前端,在线炒粉,nmsl'
let reg = /(菜鸡|nmsl)/g
str.replace(reg, ($0)=>{
let char = '',
len = $0.length
i = 0
for(i; i < len; i++){
char+='*'
}
return char
})
// **前端,在线炒粉,****
当然这只是基本操作,下面要查找出一段纯字母字符串中出现最多次的字符以及该字符是哪个
可能有些小伙伴会有看过这个题目,或者在面试时会被问到,方法就是通过遍历字符串,用一个对象来记录下对应的字符和出现的次数
今天我们将又学会一个方法,那就是使用 replace。这个方法是我在掘金上看到,看完后有点意想不到的效果,还挺有意思,也是促使我去重新学习一次 replace 并写下这篇笔记的初衷。
代码:
function findMaxChar(str){
let reg = /(\w)\1+/g,
num = 0,
char = ''
str = str.split('').sort().join('')
str.replace(reg,($0,$1)=>{
if(num < $0.length){
num = $0.length
char = $1
}
})
return `出现最多的字符:${char},次数${num}`
}
仔细解读后,相信你也会和我一样感觉到有意思
写在最后
看到一些简单的东西,我们都自认为懂了,会用了。但在仔细研究后,我们可能会发现一片新大陆。在学习过程中,我们始终要对知识抱有敬畏之心,同时要想一想简单的东西怎么能变得不简单。在了解的越多之后,才会发现自己有多渺小。
正则replace 回调函数里接收的参数是什么?的更多相关文章
- iOS下ajax回调函数里不能播放audio
iOS下audio必须监测到事件才可播放, ajax回调函数里不能播放 解决办法 在点击方法里先播放然后立即暂停,在回调函数里重新播放 onclick(function(){ $("#_wx ...
- C++: 带参数回调函数和不带参数的回调函数;
在C++中,回调函数的应用比较广泛且重要. 通过传递函数指针到其他地方,能够实现远程回调的作用,能够实现远程调用而不需要事件触发信号或者其他机制来实现,方便而快捷: 首先,回调函数有两种形式: 静态 ...
- [Perl] Getopt 函数来接收用户参数的使用
我们在linux常常用到一个程序需要加入参数,现在了解一下perl中的有关控制参数的函数.getopt.在linux有的参数有二种形式.一种是–help,另一种是-h.也就是-和–的分别.–表示完整参 ...
- JavaScript replace 回调函数用法
params.query = params.query.replace(/[\+\-\&\|\!\(\)\{\}\[\]\^\"\~\*\?\:\\]/g,function(a){ ...
- layer 点击yes后在回调函数里获取layer.open({})iframe里面元素
参考:http://fly.layui.com/jie/19690/ yes: function(index, layero) { uid.value = $(layero).find('iframe ...
- callback 回调函数
把函数a当做一个参数传入函数b <script> Array.prototype.mysort = function(callback){ let s = this; //准备向回调函数里 ...
- 解决有关flask-socketio中服务端和客户端回调函数callback参数的问题(全网最全)
由于工作当中需要用的flask_socketio,所以自己学习了一下如何使用,查阅了有关文档,当看到回调函数callback的时候,发现文档里都描述的不太清楚,最后终于琢磨出来了,分享给有需要的朋友 ...
- js回调函数(callback)理解
Mark! js学习 不喜欢js,但是喜欢jquery,不解释. 自学jquery的时候,看到一英文词(Callback),顿时背部隐隐冒冷汗.迅速google之,发现原来中文翻译成回调.也就是回调函 ...
- Delphi对象变成Windows控件的前世今生(关键是设置句柄和回调函数)goodx
----------------------------------------------------------------------第一步,准备工作:预定义一个全局Win控件变量,以及一个精简 ...
随机推荐
- 类型擦除真的能完全擦除一切信息吗?java 泛型揭秘
背景 我们都知道泛型本质上是提供类型的"类型参数",它们也被称为参数化类型(parameterized type)或参量多态(parametric polymorphism).其实 ...
- T-SQL Part VII: CROSS JOIN
虽然不能确定是不是只有个SQL Server提供了Cross Join的功能,貌似W3School的SQL教程中是没有的 SQL教程.而Wikipedia中倒是有,也是最新的SQL:2011SQL:2 ...
- PHP中高级面试题 一个高频面试题:怎么保证缓存与数据库的双写一致性?
分布式缓存是现在很多分布式应用中必不可少的组件,但是用到了分布式缓存,就可能会涉及到缓存与数据库双存储双写,你只要是双写,就一定会有数据一致性的问题,那么你如何解决一致性问题? Cache Aside ...
- [UWP]通过自定义XamlCompositionBrushBase实现图片平铺
1. 什么是XamlCompositionBrushBase 我早就想试试自定义XamlCompositionBrushBase,但一直没机会.上一篇文章介绍到使用Win2D的BorderEffect ...
- Appium+python自动化(四十一)-Appium自动化测试框架综合实践 - 即将落下帷幕(超详解)
1.简介 今天我们紧接着上一篇继续分享Appium自动化测试框架综合实践 - 代码实现.到今天为止,大功即将告成:框架所需要的代码实现都基本完成. 2.data数据封装 2.1使用背景 在实际项目过程 ...
- 如何基于k8s快速搭建TeamCity(YAML分享)
前言 最近有朋友基于之前的博客<Docker最全教程之使用TeamCity来完成内部CI.CD流程(十七)>搭建TeamCity时出现了一些问题,由于平常比较忙,没有及时答复,非常抱歉. ...
- .NET Core 3 WPF MVVM框架 Prism系列之数据绑定
一.安装Prism 1.使用程序包管理控制台 Install-Package Prism.Unity -Version 7.2.0.1367 也可以去掉‘-Version 7.2.0.1367’获取最 ...
- 如何使用Sping Data JPA更新局部字段
问题描述 在更新数据时,有时候我们只需要更新一部分字段,其他字段保持不变.Spring Data JPA并未提供现成的接口,直接使用save()更新会导致其他字段被Null覆盖掉. 解决办法 通常有两 ...
- jsp页面使用EL表达式 使用Jstl标签库中的标签,需要引入jstl.jar和standard.jar
spring boot 中使用jstl 首先在pom中加入 <dependency> <groupId>jstl</groupId> <artifactId& ...
- Java多线程——多线程方法详解
本系列文章是Java多线程的详解介绍,对多线程还不熟悉的同学可以先去看一下我的这篇博客Java基础系列3:多线程超详细总结,这篇博客从宏观层面介绍了多线程的整体概况,接下来的几篇文章是对多线程的深入剖 ...