正则表达式结合自定义function使用replace

replace使用正则表达式和function替换
js代码

html代码

场景描述
输入不同数量的人名,根据不同的人数打印不同的描述

代码分析
首先在js代码中使用templates定义了5个模板,通过 var idx = Math.min(names.length, 4)根据人数获取对应的模板的索引,通过 return templates[idx].replace(/{name}|{others}/g, function(val){ console.log(val) return val === ‘{name}’?names.shift():names.length })替换模板对应的位置,输出结果

首先在对应位置打断点进行调试

分别在9、11、12三个位置打上了断点,运行console.log(likes([‘John’]))时获取的idx为1,即使用模板一,通过正则表达式/{name}|{others}/g去匹配对应的数据,其中|代表或者,代表全局替换

当到达11时打印val

划重点:可见val就是需要匹配的字段

由此说明,当使用正则表达式且replace第二个参数为function时,function的接收的参数就是需要匹配的字段,并且将由function的返回值替换匹配的字段,就可以通过判断val的值进行不同的操作

其中return val === ‘{name}’?names.shift():names.length这段代码的细节之处在于,可以通过names下标去返回需要替换的值,但是这样做的话在替换others时就需要进行减法运算,但是如果使用shift(),就不需要进行减法操作了,names.shift() 正则顺序是吻合的,直接完美契合!因为shift()的功能是删除并返回数组的第一个元素。

下图为运行到console.log(likes([‘John’, ‘Jane’, ‘Andrew’, ‘Jennifer’]))时的数据,由于shift()已经将前两个数据弹出数组,所以数组的长度完全符合,直接获取就可以了

总结
replace()方法结合正则表达式,通过自定义的回调函数,可以实现各种复杂的字符串处理需求。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/37094.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

tqdm库教程 - 进度条可视化利器

tqdm库教程 - 进度条可视化利器 1. 什么是tqdm?2. tqdm的基本用法3. tqdm的高级用法3.1 自定义描述3.2 手动更新进度条3.3 在文件处理中使用tqdm 4. tqdm的其他特性4.1 嵌套进度条4.2 在Jupyter Notebook中使用 5. 总结 1. 什么是tqdm? tqdm是一个Python库,用于在循环或长时…

揭秘多年免费听音乐、直播、影视的自用方案:手机、电视、电脑多平台0成本实现媒体自由(内含相关资源)

文章目录 📖 介绍 📖🏡 演示环境 🏡📒 多媒体自由 📒🎧 音乐资源📱安卓平台🍎 苹果平台💻 PC平台🎥 影视资源📱 安卓平台🍎 苹果平台📺 电视盒子💻 PC平台📥 电影下载📺 直播资源📱 手机平台💻 PC平台📺 电视盒子⚓️ 相关链接 ⚓️�…

秋招力扣刷题——数据流的中位数

一、题目要求 中位数是有序整数列表中的中间值。如果列表的大小是偶数,则没有中间值,中位数是两个中间值的平均值。 例如 arr [2,3,4] 的中位数是 3 。 例如 arr [2,3] 的中位数是 (2 3) / 2 2.5 。 实现 MedianFinder 类: MedianFinder() 初始化 …

ISS检测原理

ISS(Intrinsic Shape Signatures)是由Yu Zhong于2009年提出的一种三维形状描述子,用于描述局部或半局部区域的点云,局部区域可以理解为以一个点云中某点为球心,以一定半径构成的可以包含多个内点的球形区域,半局部则是半个球形区域。ISS可用于不同视角点云的配准、快速姿…

大数据面试题之Spark(4)

目录 RDD的容错 Executor内存分配? Spark的batchsize,怎么解决小文件合并问题? Spark参数(性能)调优 介绍一下Spark怎么基于内存计算的 说下什么是RDD(对RDD的理解)?RDD有哪些特点?说下知道的RDD算子 RDD底层原理 RDD属性 RDD的缓存级别? Spark广播变…

MongoDB笔记02

MongoDB中的数据具有灵活的模式,文档在同一集合,但他们不需要具有相同的字段或结构集合,集合文档中的公共字段可以包含不同类型的数据 MongoDB中的数据具有灵活的模式,与sql数据库不同,sql数据库必须在插入数据之前确…

Nuxt3 的生命周期和钩子函数(六)

title: Nuxt3 的生命周期和钩子函数(六) date: 2024/6/30 updated: 2024/6/30 author: cmdragon excerpt: 摘要:本文深入解析了Nuxt3框架中的多个核心生命周期钩子和组件注册功能,包括imports:sources、imports:extend、import…

刷代码随想录有感(121):贪心算法——买卖股票的最佳时机III

题干&#xff1a; 代码&#xff1a; class Solution { public:int maxProfit(vector<int>& prices) {if (prices.size() < 2) return 0;int buy1 prices[0];int buy2 prices[0];int sell1 0, sell2 0;for (int i 1; i < prices.size(); i) {buy1 min(bu…

LLVM 中的指令调度器及其工作过程

LLVM 中的指令调度器及其工作过程 概述 LLVM 中实现了多种指令调度器&#xff0c;分别作用于后端流程的不同阶段&#xff0c;包括指令选择阶段的指令调度器、寄存器分配前的指令调度器和寄存器分配后的指令调度器 这三类调度器都有llc命令行选项可以控制其使能或禁用 在寄存…

解密Eureka UNKNOWN状态:服务注册的隐形守护者

&#x1f310; 解密Eureka UNKNOWN状态&#xff1a;服务注册的隐形守护者 在微服务架构中&#xff0c;Eureka作为Netflix开源的服务发现框架&#xff0c;扮演着服务注册与发现的核心角色。然而&#xff0c;在Eureka的Dashboard上&#xff0c;我们有时会遇到服务状态显示为UNKN…

dsp入门

安装环境 安装 ccs5.5安装 BIOS-MCSDK 多核软件开发包安装 仿真器驱动 工程创建与导入工程 创建工程 创建工程填信息添加.cmd文件&#xff0c;配置内存编译 导入工程 导入 配置工程 选择properties 环境变量 头文件 库文件 仿真器 添加仿真器 先调出仿真器界面创建仿…

rtthread stm32h743的使用(十二)spi设备fal驱动的使用

我们要在rtthread studio 开发环境中建立stm32h743xih6芯片的工程。我们使用一块stm32h743及fpga的核心板完成相关实验&#xff0c;核心板如图&#xff1a; fal驱动的使用是建立在sfud驱动之上的&#xff0c;所以我们在上一节使用的工程基础上继续实验。 1.在上一节工程的基础…

SpringCloud Alibaba Seata2.0基础入门与安装

官网地址&#xff1a;https://seata.apache.org/zh-cn/ GitHub下载地址&#xff1a;https://github.com/apache/incubator-seata/releases 本文这里下载的是seata2.0.0版本。 【1】概述 ① Seata是什么 Simple Extensible Autonomous Transaction Architecture&#xff0c…

C++ 设计模式之访问者模式

C 设计模式之访问者模式 简介 1、访问者模式 &#xff08;Visitor&#xff09;是一种行为型设计模式&#xff0c;它表示一个作用于某对象结构中的各元素的操作。它使你可以在不改变各元素的类的前提下定义作用于这些元素的新操作。 使用该模式可以在不修改已有程序结构的前提…

vue3 全局引入 onMounted, reactive, ref 的插件全局引入

webpack 的引入 npm install -D unplugin-auto-import const AutoImport require(unplugin-auto-import/webpack).default;configureWebpack: {devtool: source-map,module: {rules: [{test: /\.mjs$/,include: /node_modules/,type: javascript/auto}],}, plugins: [Aut…

Java对象创建过程

在日常开发中&#xff0c;我们常常需要创建对象&#xff0c;那么通过new关键字创建对象的执行中涉及到哪些流程呢&#xff1f;本文主要围绕这个问题来展开。 类的加载 创建对象时我们常常使用new关键字。如下 ObjectA o new ObjectA();对虚拟机来讲首先需要判断ObjectA类的…

Java代码质量管理与持续集成

Java代码质量管理与持续集成 大家好&#xff0c;我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编&#xff0c;也是冬天不穿秋裤&#xff0c;天冷也要风度的程序猿&#xff01; 引言 在当今软件开发的环境中&#xff0c;高质量的代码和持续集成是保证软件项目…

# Sharding-JDBC从入门到精通(4)- Sharding-JDBC 入门程序几种配置方式

Sharding-JDBC从入门到精通&#xff08;4&#xff09;- Sharding-JDBC 入门程序几种配置方式 一、Sharding-JDBC 入门程序&#xff08;水平分表&#xff09;-使用 application.yml 配置文件的 方式 1、打开 idea 创建 artifactId 名为 dbsharding 的 maven 父工程。 --> i…

python sklearn机械学习模型-回归

&#x1f308;所属专栏&#xff1a;【机械学习】✨作者主页&#xff1a; Mr.Zwq✔️个人简介&#xff1a;一个正在努力学技术的Python领域创作者&#xff0c;擅长爬虫&#xff0c;逆向&#xff0c;全栈方向&#xff0c;专注基础和实战分享&#xff0c;欢迎咨询&#xff01; 您…

redis实战-添加商户缓存

为什么要使用缓存 言简意赅&#xff1a;速度快&#xff0c;好用缓存数据存储于代码中&#xff0c;而代码运行在内存中&#xff0c;内存的读写性能远高于磁盘&#xff0c;缓存可以大大降低用户访问并发量带来的服务器读写压力实际开发中&#xff0c;企业的数据量&#xff0c;少…