javascript中的replace函数(带注释demo)
作者:史林枫 发布时间:2024-04-18 09:47:52
javascript这门语言一直就像一位带着面纱的美女,总是看不清,摸不透,一直专注服务器端,也从来没有特别重视过,直到最近几年,javascript越来越重要,越来越通用。最近和前端走的比较近,借此机会,好好巩固一下相关知识点。
1.初识replace
在js中有两个replace函数 一个是location.replace(url) 跳转到一个新的url
一个string.replace("xx","yy")
替换字符串 返回一个新的字符串,该方法并不改变字符串本身
location.replace(url) 无痕跳转(将当前链接导航到一个新的url 并不保存历史记录)
与之相对的是location.href="url" rel="external nofollow" 有痕跳转(将当前链接导航到一个新的url 且保存历史记录) 这个没有比较清晰
string.replace函数 很多初学者,会认为这个跟C#中的Replace一样,但并不相同,js中replace更灵活。
最基本的用法 就是简单替换字符串。来看一个例子:
var str = "abcd-abcd-abcd";
var result = str.replace("a", "");
console.log(result);
//输出 bcd-abcd-abcd
//当第一个参数是一个简单字符串时,仅替换第一个匹配项
2.走进replace之正则表达式
参数一:正则表达式对象或字面量(支持gi模式) g全局匹配 i忽略大小写
参数二:要替换的字符串或一个function
可以使用正则表达式的相关引用
如果是function,则替换为function的返回值
此function的参数:
match 匹配的子串。(对应于上述的$&。)
p1,p2, ... 假如replace()方法的第一个参数是一个RegExp 对象,则代表第n个括号匹配的字符串。(对应于上述的$1,$2等。)
offset 匹配到的子字符串在原字符串中的偏移量。(比如,如果原字符串是“abcd”,匹配到的子字符串是“bc”,那么这个参数将是1)
string 被匹配的原字符串。
正则表达的引用
$$ 插入一个 "$"。
$& 插入匹配的子串。
$` 插入当前匹配的子串左边的内容。
$' 插入当前匹配的子串右边的内容。
$n 假如第一个参数是 RegExp对象,并且 n 是个小于100的非负整数,那么插入第 n 个括号匹配的字符串。
3.来一轮带注释的demo,彻底搞懂javascript中的replace函数:
全局匹配:
var str = "abcd-abcd-abcd";
var result = str.replace(/a/g, "e");
console.log(result);
//输出 ebcd-ebcd-ebcd
//g全局匹配 所有a字符串都将被替换
忽略大小写匹配:
var str = "abcd-abcd-abcd";
var result = str.replace(/A/i, "e");
console.log(result);
// 输出 ebcd-abcd-abcd
// 忽略大小写的匹配 但没有进行全局匹配 所以只替换第一个a
忽略大小写且全局匹配:
var str = "abcd-abcd-abcd";
var result = str.replace(/A/gi, "e");
console.log(result);
// 输出 ebcd-ebcd-ebcd
// 忽略大小写并全局匹配 所有a都被替换
使用function作为第二参数:
var str = "abcd-abcd-1234";
var result = str.replace(/([a-z]*)-([a-z]*)/gi, function(match,p1,p2,offset,str){
console.log(match); //abcd-abcd 匹配的内容
console.log(p1); //第一个括号中匹配的内容
console.log(p2); //第二个括号匹配的内容
console.log(offset);//0 匹配到的字符串的索引(偏移量)
console.log(str); //原始字符串
return [p1,p2].join("+");
});
console.log(result);
// 输出 abcd+abcd+1234
// 原字符串中 abcd-abcd 被匹配后 被替换为function返回的内容
在参数中引用正则表达式匹配项:
var str = "a b";
var result = str.replace(/(\w+)\s(\w+)/gi, "$2 $1");
console.log(result);
//输出 b a
// 这里的$1 $2分别引用正则表达式中第一个喝第二个括号匹配的内容
在参数中引用匹配项左侧内容:
var str = 'abc';
var result = str.replace(/b/g, "$`"); //$`代表匹配字符的左侧内容
console.log(result);
//输出: aac
在参数中引用匹配项右侧内容:
var str = 'abc';
var result = str.replace(/b/g, "$'"); //$'代表匹配字符的右侧内容
console.log(result);
//输出: acc
使用正则表达式对象:
var str = "a b";
var reg = new RegExp(/(\w+)\s(\w+)/, "gi"); //也可以使用正则表示对象来最为参数
var result = str.replace(reg, "$2 $1");
console.log(result); //输出 b a
有了这些例子 加上开头的名词解释,相信你已经彻底搞懂了javascript中的replace函数!
总结
以上所述是小编给大家介绍的javascript中的replace函数(带注释demo),希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!
来源:https://www.cnblogs.com/jayshsoft/archive/2018/01/05/8207108.html
猜你喜欢
- 1.安装相应的库文件sudo apt-get install python-mysqldb2.数据库操作import MySQLdb db
- 在 Go 语言中,map 是一种非常常见的数据类型,它可以用于快速地检索数据。Go 语言中的 map 与其他编程语言中的类似的数据类型相比,
- SQL Server 2019 Enterprise (x64) - DVD (Chinese-Simplified)企业版ed2k://|
- date("yyyyMMdd",time()) date() 函数功能:用于格式化时间,返回一个字符串。&nb
- 计算矩阵标准差>>> a = np.array([[1, 2], [3, 4]])>>> np.std(
- 一、InnoDB的表级锁在绝大多数情况下应该使用行锁,因为事务和行锁往往是选择InnoDB的理由,但个别情况下也使用表级锁。事务需要更新大部
- pytorch更新完后合并了Variable与Tensortorch.Tensor()能像Variable一样进行反向传播的更新,返回值为T
- python openvc 裁剪图片下面是4个坐标代码:import cv2#裁剪图片路径input_path,四个裁剪坐标为:y1,y2,
- 解决方法一: mysql安装时候的编码, 看下my.ini,有无 [mysql] default-character-set=utf8 [c
- Python 中提供了对时间日期的多种多样的处理方式,主要是在 time 和 datetime 这两个模块里。一、time 模块time 模
- 网易最近出的一款自动化UI测试工具:Airtest 挺火的,还受到谷歌的推荐。我试着用了一下,感觉优缺点还是蛮明显的。对初学者来说,能用到的
- 在Dreamweaver 4.0中,我们就已接触了模板与库的概念,知道它们是批量生成风格类似的网页的好工具。如今在Dreamweaver M
- 问题描述Python调整图片文件的占用空间大小,而不是分辨率1.jpg图片大小为 8KB 减小文件大小使用 PIL 模块pip i
- 网上的关于django-scrapy的介绍比较少,该博客只在本人查资料的过程中学习的,如果不对之处,希望指出改正;以后的博客可能不会再出关于
- 这篇文章主要介绍了JS图片懒加载的优点及实现原理,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以
- 最近开发了一个 Google Analytics 相关的应用,但需要在 Windows 下部署,结合网上的相关经验,最终选择了 apache
- scrapy.FormRequestlogin.pyclass LoginSpider(scrapy.Spider): name =
- 继续flask的学习之旅。今天介绍flask的登陆管理模块,还记得上一篇中的blog小项目么,登录是咱们自己写的验证代码,大概有以下几个步骤
- 小试牛刀:1.需要python如何读取文件2.需要python操作list3.需要使用split()对字符串进行分割代码运行截图 :代码(c
- 本文实例讲述了Python常见数字运算操作。分享给大家供大家参考,具体如下:Python 解释器可以作为一个简单的计算器:您可以在解释器里输