JS替换字符串中指定位置的字符(多种方法)


Posted in Javascript onMay 28, 2020

假设有一个字符串,可能'Good Morning'也可能是'Hello World',我想将第五个字符,替换成'-'
因为字符串虽然可以像数组那样获取某一位置字符'Hello World'[4],但是不能像数组那样直接修改某一位置的字符'Hello World'[4] = '-',这样是行不通的,但是可以把它切分成数组,修改某一位置的值,然后在合并回来。
方法1:

const replaceStr1 = (str, index, char) => {
 const strAry = str.split('');
 strAry[index] = char;
 return strAry.join('');
 }
 replaceStr(str1, 4, '-'); // => Good-Morning
 replaceStr(str2, 4, '-'); // => Hell- World

js的字符串有个substring方法,用于提取字符串中介于两个指定下标之间的字符,也就是说可以用'Hello World'.substring(0, 4),得到Hell,加上要替换的字符,再加上后面的字符串就可以。
方法2:

const replaceStr2 = (str, index, char) => {
 return str.substring(0, index) + char + str.substring(index + 1);
 }
 replaceStr2(str1, 4, '-'); // => Good-Morning
 replaceStr2(str2, 4, '-'); // => Hell- World

ps:下面看下js替换字符串中所有指定的字符

第一次发现JavaScript中replace()方法如果直接用str.replace("-","!")只会替换第一个匹配的字符.
str.replace(/\-/g,"!")则可以全部替换掉匹配的字符(g为全局标志)。

replace()
Thereplace()methodreturnsthestringthatresultswhenyoureplacetextmatchingitsfirstargument
(aregularexpression)withthetextofthesecondargument(astring).
Iftheg(global)flagisnotsetintheregularexpressiondeclaration,thismethodreplacesonlythefirst
occurrenceofthepattern.Forexample,

vars="Hello.Regexpsarefun.";s=s.replace(/\./,"!");//replacefirstperiodwithanexclamationpointalert(s);

producesthestring“Hello!Regexpsarefun.”Includingthegflagwillcausetheinterpreterto
performaglobalreplace,findingandreplacingeverymatchingsubstring.Forexample,

vars="Hello.Regexpsarefun.";s=s.replace(/\./g,"!");//replaceallperiodswithexclamationpointsalert(s);

yieldsthisresult:“Hello!Regexpsarefun!”

所以可以用以下几种方式.:

string.replace(/reallyDo/g,replaceWith);
string.replace(newRegExp(reallyDo,'g'),replaceWith);

string:字符串表达式包含要替代的子字符串。
reallyDo:被搜索的子字符串。
replaceWith:用于替换的子字符串。

Js代码

<script type="text/javascript"> 
String.prototype.replaceAll = function(reallyDo, replaceWith, ignoreCase) { 
  if (!RegExp.prototype.isPrototypeOf(reallyDo)) { 
    return this.replace(new RegExp(reallyDo, (ignoreCase ? "gi": "g")), replaceWith); 
  } else { 
    return this.replace(reallyDo, replaceWith); 
  } 
} 
</script>

总结

到此这篇关于JS替换字符串中指定位置的字符的文章就介绍到这了,更多相关js替换字符内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
jQuery Ajax 全解析
Feb 08 Javascript
jQuery 选择器理解
Mar 16 Javascript
JavaScript 学习历程和心得分享
Dec 12 Javascript
js控制table合并具体实现
Feb 20 Javascript
javascript实现通过表格绘制颜色填充矩形的方法
Apr 21 Javascript
全面解析Angular中$Apply()及$Digest()的区别
Aug 04 Javascript
JavaScript 函数模式详解及示例
Sep 07 Javascript
详解自动生成博客目录案例
Dec 09 Javascript
js中数组插入、删除元素操作的方法
Feb 15 Javascript
详解Vue快速零配置的打包工具——parcel
Jan 16 Javascript
vue初尝试--项目结构(推荐)
Jan 30 Javascript
解决JQuery的ajax函数执行失败alert函数弹框一闪而过问题
Apr 10 jQuery
js实现九宫格布局效果
May 28 #Javascript
微信小程序实现电子签名并导出图片
May 27 #Javascript
JS 逻辑判断不要只知道用 if-else 和 switch条件判断(小技巧)
May 27 #Javascript
微信公众号网页分享功能开发的示例代码
May 27 #Javascript
JS字符串补全方法padStart()和padEnd()
May 27 #Javascript
Js生成随机数/随机字符串的方法小结【5种方法】
May 27 #Javascript
JS箭头函数和常规函数之间的区别实例分析【 5 个区别】
May 27 #Javascript
You might like
盘点被央视点名过的日本动画电影 一部比一部强
2020/03/08 日漫
PHP写的求多项式导数的函数代码
2012/07/04 PHP
php中substr()函数参数说明及用法实例
2014/11/15 PHP
分享一个Laravel好用的Cache宏
2015/03/02 PHP
PHP常用工具函数小结【移除XSS攻击、UTF8与GBK编码转换等】
2019/04/27 PHP
jQuery使用手册之 事件处理
2007/03/24 Javascript
Javascript &amp; DHTML 实例编程(教程)DOM基础和基本API
2007/06/02 Javascript
JavaScript 获取用户客户端操作系统版本
2009/08/25 Javascript
模仿JQuery.extend函数扩展自己对象的js代码
2009/12/09 Javascript
13 个JavaScript 性能提升技巧分享
2012/07/26 Javascript
Javascript调用函数方法的几种方式介绍
2015/03/20 Javascript
jQuery实现仿QQ空间装扮预览图片的鼠标提示效果代码
2015/10/30 Javascript
jQuery Validate表单验证插件 添加class属性形式的校验
2016/01/18 Javascript
javascript实现仿百度图片的瀑布流加载效果
2016/04/20 Javascript
jQuery实现立体式数字滚动条增加效果
2016/12/21 Javascript
react以create-react-app为基础创建项目
2018/03/14 Javascript
JS实现获取当前所在周的周六、周日示例分析
2019/05/11 Javascript
Vue.js中该如何自己维护路由跳转记录
2019/05/19 Javascript
解决vue中使用less/sass及使用中遇到无效的问题
2020/10/24 Javascript
[03:10]2014DOTA2 TI马来劲旅Titan首战告捷目标只是8强
2014/07/10 DOTA
Python中使用插入排序算法的简单分析与代码示例
2016/05/04 Python
Python构建XML树结构的方法示例
2017/06/30 Python
PyQt5每天必学之关闭窗口
2018/04/19 Python
Python3.4学习笔记之 idle 清屏扩展插件用法分析
2019/03/01 Python
python读csv文件时指定行为表头或无表头的方法
2019/06/26 Python
Python tkinter和exe打包的方法
2020/02/05 Python
关于CSS Tooltips(鼠标经过时显示)的效果
2013/04/10 HTML / CSS
简单几步用纯CSS3实现3D翻转效果
2019/01/17 HTML / CSS
日本最新流行服饰网购:Nissen
2016/07/24 全球购物
斯凯奇美国官网:SKECHERS美国
2016/08/20 全球购物
社区道德讲堂实施方案
2014/03/21 职场文书
关爱残疾人演讲稿
2014/05/24 职场文书
在校大学生自我评价范文
2014/09/12 职场文书
2014个人反腐倡廉思想汇报
2014/09/15 职场文书
HTML+css盒子模型案例(圆,半圆等)“border-radius” 简单易上手
2021/05/10 HTML / CSS
Java 数组的使用
2022/05/11 Java/Android