守望者--AIR技术交流

 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,访问微社区

搜索
热搜: ANE FlasCC 炼金术
查看: 274|回复: 0

[技术资料] 深入理解JavaScript-replace

[复制链接]
  • TA的每日心情
    擦汗
    2018-4-10 15:18
  • 签到天数: 447 天

    [LV.9]以坛为家II

    1742

    主题

    2094

    帖子

    13万

    积分

    超级版主

    Rank: 18Rank: 18Rank: 18Rank: 18Rank: 18

    威望
    562
    贡献
    29
    金币
    51661
    钢镚
    1422

    开源英雄守望者

    发表于 2016-8-11 14:19:31 | 显示全部楼层 |阅读模式

    来源:http://div.io/topic/836

    replace方法是属于String对象的,可用于替换字符串。

    简单介绍:

    String.replace(searchValue,replaceValue)

    1. String:字符串
    2. searchValue:字符串或正则表达式
    3. replaceValue:字符串或者函数

    字符串替换字符串

    'I am loser!'.replace('loser','hero')
    //I am hero!

    直接使用字符串能让自己从loser变成hero,但是如果有2个loser就不能一起变成hero了。

    'I am loser,You are loser'.replace('loser','hero');
    //I am hero,You are loser

    正则表达式替换为字符串

    'I am loser,You are loser'.replace(/loser/g,'hero')
    //I am hero,You are hero

    使用正则表达式,并将正则的global属性改为true则可以让所有loser都变为hero

    有趣的替换字符

    replaceValue 可以是字符串。如果字符串中有几个特定字符的话,会被转换为特定字符串。

    字符替换文本
    $&与正则相匹配的字符串
    $`匹配字符串左边的字符
    $'匹配字符串右边的字符
    $1,$2,$3,…,$n匹配结果中对应的分组匹配结果

    使用$&字符给匹配字符加大括号

    var sStr='讨论一下正则表达式中的replace的用法';
    sStr.replace(/正则表达式/,'{$&}');
    //讨论一下{正则表达式}中的replace的用法

    使用$`和$'字符替换内容

    'abc'.replace(/b/,"$`");//aac
    'abc'.replace(/b/,"$'");//acc

    使用分组匹配组合新的字符串

    'nimojs@126.com'.replace(/(.+)(@)(.*)/,"$2$1")//@nimojs

    replaceValue参数可以是一个函数

    String.replace(searchValue,replaceValue) 中的replaceValue可以是一个函数.

    如果replaceValue是一个函数的话那么,这个函数的arguments会有n+3个参数(n为正则匹配到的次数)

    先看例子帮助理解:

    function logArguments(){    
        console.log(arguments);//["nimojs@126.com", "nimojs", "@", "126.com", 0, "nimojs@126.com"] 
        return '返回值会替换掉匹配到的目标'
    }
    console.log(
        'nimojs@126.com'.replace(/(.+)(@)(.*)/,logArguments)
    )

    参数分别为

    1. 匹配到的字符串(此例为nimojs@126.com,推荐修改上面代码的正则来查看匹配到的字符帮助理解)
    2. 如果正则使用了分组匹配就为多个否则无此参数。(此例的参数就分别为"nimojs", "@", "126.com"。推荐修改正则为/nimo/查看控制台中返回的arguments值)
    3. 匹配字符串的对应索引位置(此例为0)
    4. 原始字符串(此例为nimojs@126.com)

    使用自定义函数将A-G字符串改为小写

    'JAVASCRIPT'.replace(/[A-G]/g,function(){
        return arguments[0].toLowerCase();
    })//JaVaScRIPT

    使用自定义函数做回调式替换将行内样式中的单引号删除

    '<span style="font-family:\'微软雅黑\';">;demo</span>'.replace(/\'[^']+\'/g,function(){      
        var sResult=arguments[0];
        console.log(sResult);//'微软雅黑'
        sResult=sResult.replace(/\'/g,'');
        console.log(sResult);//微软雅黑
        return sResult;
    })//<span style="font-family:微软雅黑;">demo</span>

    最后的小试牛刀

    这一节是交给阅读者发挥的内容:

    洗扑克

    需要将ThisNimojs-JavaScript使用正则替换成 TJhaivsaNSicmroijpst

    守望者AIR技术交流社区(www.airmyth.com)
    回复

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    
    关闭

    站长推荐上一条 /4 下一条

    QQ|手机版|Archiver|网站地图|小黑屋|守望者 ( 京ICP备14061876号

    GMT+8, 2019-7-17 15:20 , Processed in 0.042259 second(s), 31 queries .

    守望者AIR

    守望者AIR技术交流社区

    本站成立于 2014年12月31日

    快速回复 返回顶部 返回列表