replace() 方法返回一个由替换值替换一些或所有匹配的模式后的新字符串。模式可以是一个字符串或者一个正则表达式, 替换值可以是一个字符串或者一个每次匹配都要调用的函数。

注意:原字符串不会改变。

语法

str.replace(regexp|substrnewSubStr|function)

参数

regexp (pattern)
一个RegExp 对象或者其字面量。该正则所匹配的内容会被第二个参数的返回值替换掉。
substr (pattern)
一个要被 newSubStr 替换的字符串。其被视为一整个字符串,而不是一个正则表达式。仅仅是第一个匹配会被替换。
newSubStr (replacement)
 用于替换掉第一个参数在原字符串中的匹配部分的字符串。该字符串中可以内插一些特殊的变量名。参考下面的使用字符串作为参数
function (replacement)
一个用来创建新子字符串的函数,该函数的返回值将替换掉第一个参数匹配到的结果。参考下面的指定一个函数作为参数

返回值

一个部分或全部匹配由替代模式所取代的新的字符串。

描述

该方法并不改变调用它的字符串本身,而只是返回一个新的替换后的字符串。

在进行全局的搜索替换时,正则表达式需包含 g 标志。

使用字符串作为参数

替换字符串可以插入下面的特殊变量名:

变量名 代表的值
$$ 插入一个 "$"。
$& 插入匹配的子串。
$` 插入当前匹配的子串左边的内容。
$' 插入当前匹配的子串右边的内容。
$n

假如第一个参数是 RegExp对象,并且 n 是个小于100的非负整数,那么插入第 n 个括号匹配的字符串。

指定一个函数作为参数

你可以指定一个函数作为第二个参数。在这种情况下,当匹配执行后, 该函数就会执行。 函数的返回值作为替换字符串。 (注意:  上面提到的特殊替换参数在这里不能被使用。) 另外要注意的是, 如果第一个参数是正则表达式, 并且其为全局匹配模式, 那么这个方法将被多次调用, 每次匹配都会被调用。

下面是该函数的参数:

变量名 代表的值
match 匹配的子串。(对应于上述的$&。)
p1,p2, ...

假如replace()方法的第一个参数是一个RegExp 对象,则代表第n个括号匹配的字符串。(对应于上述的$1,$2等。)

offset

匹配到的子字符串在原字符串中的偏移量。(比如,如果原字符串是“abcd”,匹配到的子字符串是“bc”,那么这个参数将是1)

string 被匹配的原字符串。

(精确的参数个数依赖于replace()的第一个参数是否是一个正则表达式对象, 以及这个正则表达式中指定了多少个括号子串。)

下面的例子将会使 newString 变成'abc - 12345 - #$*%':

function replacer(match, p1, p2, p3, offset, string) {
// p1 is nondigits, p2 digits, and p3 non-alphanumerics
return [p1, p2, p3].join(' - ');
}
var newString = 'abc12345#$*%'.replace(/([^\d]*)(\d*)([^\w]*)/, replacer);
console.log(newString); // abc - 12345 - #$*%

例子2:

function camelize(str) {
  return str.replace(/-+(.)?/g,function(match,chr){
    return chr ? chr.toUpperCase():''
  })
}

camelize('background-color')
"backgroundColor"

js小知识-replace的回调函数的更多相关文章

  1. replace的回调函数。

    今天在看算法时,看到一些题目,感觉replace的回调函数好奇葩,$0 .$1什么的: JS的replace方法: str.replace(regexp|substr, newSubStr|funct ...

  2. js中replace的回调函数使用。

    这只是一个小问题,但是之前并没有发现.这个问题就是replace的第二个函数是支持回调函数的. var ext = new RegExp('f','g'); 1.str.replace(ext ,1) ...

  3. 第24篇 js小知识和“坑”

    前面说了说了js的相关知识,基本上除了语法外,把项目常用的知识做了一个梳理,现在说下js的其它方面的知识,这些知识不成体系,属于不理解对于一般开发没什么太多影响,但如果理解清楚,可以更好去开发. js ...

  4. 微信小程序开发——使用回调函数出现异常:TypeError: Cannot read property 'setData' of undefined

    关键技术点: 作用域问题——回调函数中的作用域已经脱离了调用函数了,因此需要在回调函数外边把this赋给一个新的变量才可以了. 业务需求: 微信小程序开发,业务逻辑需要,需要把获取手机号码的业务逻辑作 ...

  5. 零散的JS和node.js小知识

    JS的连续赋值和曾经出现的怪异情况 let a=1; let b=a=3; 如上的真实赋值过程 => a=1 => a=3 => b=3 => 一般来说,等号是从右向左赋值的 ...

  6. JS之Callback function(回调函数)

    JS中的回调函数: 1.概念: 函数a有一个参数,这个参数是个函数b,当函数a执行完以后执行函数b,那么这个过程就叫回调,即把函数作为参数传入到另一个函数中,这个函数就是所谓的回调函数. 2.举例: ...

  7. [js]利用闭包向post回调函数传参数

    最近在闲逛校园XX站的时候,打算搞个破坏,试试有多少人还是用初始密码登陆.比较懒,所以直接打开控制台来写. 所以问题可以描述为: 向后端不断的post数据,id从1~5000自增,后端会根据情况来返回 ...

  8. javascript实用技巧,js小知识

    一.js整数的操作 使用|0和~~可以将浮点转成整型且效率方面要比同类的parseInt,Math.round 要快,在处理像素及动画位移等效果的时候会很有用.性能比较见此. var foo = (1 ...

  9. 常用JS小知识汇总

    1 上传图片:html代码 <input id="image" type='file' name='myFile' size='15' onchange="show ...

随机推荐

  1. SQL Server学习之路(四):“增删改查”之“删”

    0.目录 1.前言 2.通过SSMS删除 3.通过SQL语句删除 3.1 删除单行数据 3.2 删除所有行数据 3.3 删除表和数据库 1.前言 增删改查都是对数据的操作,其中"删" ...

  2. dubbo源码—dubbo自定义spring xml标签

    dubbo为了和spring更好的集成,提供了一些xml配置标签,也就是自定义标签 spring自定义标签 spring自定义标签的方式如下: 设计配置属性和JavaBean 编写xsd文件,校验xm ...

  3. js 匹配2个字符串相似度

    strSimilarity2Number: function (s, t) { var n = s.length, m = t.length, d = []; var i, j, s_i, t_j, ...

  4. Linux Rsync备份服务介绍及部署守护进程模式

    rsync介绍 rsync是一款开源的.快速的.多功能的.可实现全量及增量的本地或远程数据同步备份工具 在常驻模式(daemon mode)下,rsync默认监听TCP端口873,以原生rsync传输 ...

  5. Linux学习记录--文件IO操作相关系统编程

    文件IO操作相关系统编程 这里主要说两套IO操作接口,各自是: POSIX标准 read|write接口.函数定义在#include<unistd.h> ISO C标准 fread|fwr ...

  6. ORACLE-015:ora-25153 暂时表空间为空,ora01652 无法通过128

    写了一个复杂的select语句,突然oracle就报了:ora-25153 暂时表空间为空,这个错误,于是网上查了下.发现了例如以下解决方法:创建一个新的暂时表空间. 首先要有system权限.登录进 ...

  7. action属性注入为null

    一. 问题: 今天调试代码遇到问题,使用spring管理action,当中注入了部分原始类型的属性. 配置示比例如以下: <bean class="test.login.test.Lo ...

  8. flask框架-decorator装饰器

    调用包: from functools import wraps 装饰器其实就是一个函数:参数是一个函数,返回值是一个函数 1.装饰器使用是通过@符号,在函数的上面 2.装饰器中定义的函数,要使用*a ...

  9. ASP.NET Core WebApi 返回统一格式参数

    业务场景: 业务需求要求,需要对 WebApi 接口服务统一返回参数,也就是把实际的结果用一定的格式包裹起来,比如下面格式: { "response":{ "code&q ...

  10. 自学Zabbix3.8.1.3-可视化Visualisation-Graphs特殊图表

    自学Zabbix3.8.1.3-可视化Visualisation-Graphs特殊图表 虽然一个简单的图表和自定义图标很适合访问一个项目的数据,但这两个都不允许在多个项目中快速创建一个比较图表.为了解 ...