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 相关文章推荐
10个基于浏览器的JavaScript调试工具分享
Feb 07 Javascript
用js一次改变多个input的readonly属性值的方法
Jun 11 Javascript
JS实现常见的TAB、弹出层效果(TAB标签,斑马线,遮罩层等)
Oct 08 Javascript
浅析javascript异步执行函数导致的变量变化问题解决思路
May 13 Javascript
angular中使用Socket.io实例代码
Jun 03 Javascript
在vue中获取dom元素内容的方法
Jul 10 Javascript
vue组件jsx语法的具体使用
May 21 Javascript
JavaScript链式调用实例浅析
Dec 19 Javascript
pm2启动ssr失败的解决方法
Jun 29 Javascript
js设计模式之代理模式及订阅发布模式实例详解
Aug 15 Javascript
javascript设计模式 ? 装饰模式原理与应用实例分析
Apr 14 Javascript
vue 实现element-ui中的加载中状态
Nov 11 Javascript
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
改造一台复古桌面收音机
2021/03/02 无线电
PHP 读取文件内容代码(txt,js等)
2009/12/06 PHP
Zend Framework教程之响应对象的封装Zend_Controller_Response实例详解
2016/03/07 PHP
php正则表达式验证(邮件地址、Url地址、电话号码、邮政编码)
2016/03/14 PHP
JavaScript 学习笔记(十五)
2010/01/28 Javascript
javascript contains和compareDocumentPosition 方法来确定是否HTML节点间的关系
2010/02/04 Javascript
JavaScript在XHTML中的用法详解
2013/04/11 Javascript
jQuery实现鼠标划过展示大图的方法
2015/03/09 Javascript
jquery实现点击查看更多内容控制段落文字展开折叠效果
2015/08/06 Javascript
js基础知识(公有方法、私有方法、特权方法)
2015/11/06 Javascript
jQuery 选择符详细介绍及整理
2016/12/02 Javascript
js实现鼠标跟随运动效果
2020/08/02 Javascript
Layui数据表格 前后端json数据接收的方法
2019/09/19 Javascript
vue+iview分页组件的封装
2020/11/17 Vue.js
jQuery实现本地存储
2020/12/22 jQuery
[00:32]2018DOTA2亚洲邀请赛Secret出场
2018/04/03 DOTA
python创建和删除目录的方法
2015/04/29 Python
python中文分词教程之前向最大正向匹配算法详解
2017/11/02 Python
Python基于hashlib模块的文件MD5一致性加密验证示例
2018/02/10 Python
python实现电脑自动关机
2018/06/20 Python
python数据结构之线性表的顺序存储结构
2018/09/28 Python
python3实现猜数字游戏
2020/12/07 Python
Pytorch反向求导更新网络参数的方法
2019/08/17 Python
Django Docker容器化部署之Django-Docker本地部署
2019/10/09 Python
python入门之基础语法学习笔记
2020/02/08 Python
解决Python在导入文件时的FileNotFoundError问题
2020/04/10 Python
python爬虫beautifulsoup解析html方法
2020/12/07 Python
css3与html5实现响应式导航菜单(导航栏)效果分享
2014/02/12 HTML / CSS
突袭HTML5之Javascript API扩展3—本地存储全新体验
2013/01/31 HTML / CSS
学术诚信承诺书
2014/05/26 职场文书
行政求职信
2014/07/04 职场文书
美术学专业求职信
2014/07/23 职场文书
结婚典礼致辞
2015/07/28 职场文书
巾帼建功标兵先进事迹材料
2016/02/29 职场文书
创业分两种人:那么哪些适合创业?,哪些适合不适合创业呢?
2019/08/23 职场文书
vue elementUI批量上传文件
2022/04/26 Vue.js