zoukankan      html  css  js  c++  java
  • 在javascript中使用replace

    javascript中使用replace功能很强大,不仅可以替换为字符串,还可以利用正则表达式,对匹配到的字符串为所欲为的进行操作,首先我们来了解一下replace的基本语法

    定义和用法

    replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。

    语法

    stringObject.replace(regexp/substr,replacement)

     返回值

       一个新的字符串,是用 replacement 替换了 regexp 的第一次匹配或所有匹配之后得到的。

     说明

    字符串 stringObject 的 replace() 方法执行的是查找并替换的操作。它将在 stringObject 中查找与 regexp 相匹配的子字符串,然后用 replacement 来替换这些子串。

    如果 regexp 具有全局标志 g,那么 replace() 方法将替换所有匹配的子串。否则,它只替换第一个匹配子串。

    为了对replace更深刻的认识,首先我们来练习以下Demo;

    var stringObj="中国人民共和国,我是中国人";
    var str=stringObj.replace("中国","美国");
    console.log(str);

    输出的结果为: 美国人民共和国,我是中国人

    只替换了第一个中国,如果有多个中国,则需要一个个替换,非常的麻烦,这时候可以用正则表达式替换;这时我们可以用正则表达式:

    var stringObj="中国人民共和国,我是中国人";
    var reg=new RegExp("中国","g");
    var str=stringObj.replace(reg,"美国");
    console.log(str);

    输出的结果为: 美国人民共和国,我是美国人

     Regexp中的g 表示全局标志,那么replace() 方法会替换所有匹配的子串,否则,它只替换第一个匹配的字串。

    如果上面例子中这样写:var reg=new RegExp("中国"); 则只会替换第一个中国

    我们在replace函数中,经常会遇到$1,$2,$3…这种符号,可能我们对这个不太了解,它表示的是与regexp中的第一个,第二个,第三个…表达式相匹配的文本

    var stringObj="中华人民共和国,你好哈中华";
    var str=stringObj.replace(/(中华)/g,"<font color=red>$1</font>");
    console.log(str);
    
    //以上代码还可以写成这样:
    var stringObj="中华人民共和国,你好哈中华";
    var reg=new RegExp("(中华)","g");
    var str=stringObj.replace(reg,"<font color=red>$1</font>");
    console.log(str);

    输出的结果为:<font color=red>中华</font>人民共和国,你好哈<font color=red>中华</font>

    $1表示的是第一个子匹配,同理$2表示的是第二个子匹配(就是左边表达式的第一个括号,第二个括号)

    例如:我们将”Alice,Rock” 转换为: “Rock,Alice”

    var stringObj="Alice,Rock";
    var reg=new RegExp("(\w+)s*,s*(\w+)");
    var str=stringObj.replace(reg,"$2,$1");
    console.log(str);

    输出:  Rock,Alice

    也可以写成:stringObj.replace(/(w+)s*, s*(w+)/, "$2 $1");

    Replace函数的第二个参数replacement 可以是字符串,也可以是函数,例如:

    var strObject="他今年28岁,他女儿今年6岁,他老婆今年28岁";
    function test($1){
       var year=new Date().getFullYear()-parseInt($1);
       console.log($1);
       return $1+"("+year+"年出生)"
    }
    
    var reg=/(d+)岁/g;
    var str=strObject.replace(reg,test);
    console.log(str);

    输出的结果为:

    28岁

    6岁

    28岁

    他今年28岁(1987年出生),他女儿今年6岁(2009年出生),他老婆今年28岁(1987年出生) 

    输出3 次是因为匹配到了三次,所以test执行了三次,最后把匹配的字符进行运算,返回新的字符串,所以说可以对匹配到的字符为所欲为。

    RegExp对象有两种语法

    直接量语法

    /pattern/attributes

    创建 RegExp 对象的语法:

    new RegExp(pattern, attributes);

    attributes参数有三种值

    i  大小写不敏感的匹配

    g  执行全局匹配 (查找所有的匹配而非找到第一个匹配停止)

    m 执行多行匹配

    对比这两种写法:对象创建法需要对引号“和转义符号“”等进行二次转义:如:

    var reg=/(d+)岁/g;
    // 等价于:
     var reg=new RegExp("(\d+)岁","g");
    
    var reg=/(中华)/g 
    // 等价于:
    var reg=new RegExp("中国","g");

    综合练习

     用replace取出<meta name="location" content="province=海南;city=三亚;coord=109.518466229644,18.2585830170558"> 标签中content的内容(不包括双引号)

    var strObj='<meta name="location" content="province=海南;city=三亚;coord=109.518466229644,18.2585830170558">';
    var str=strObj.replace(/(.*?")(p.*?)(".*)/,"$2");
    console.log(str);

    输出:  province=海南;city=三亚;coord=109.518466229644,18.2585830170558

  • 相关阅读:
    紫书 习题 11-15 UVa 1668 (图论构造法)
    紫书 习题 11-16 UVa 1669(树形dp)
    紫书 习题 11-12 UVa 1665 (并查集维护联通分量)
    紫书 习题 11-10 UVa 12264 (二分答案+最大流)
    紫书 习题 11-9 UVa 12549 (二分图最小点覆盖)
    紫书 例题 11-13 UVa 10735(混合图的欧拉回路)(最大流)
    欧拉回路模板
    架构设计:进程还是线程?是一个问题!(转载)
    JDK个目录,以及与环境变量的关系
    linux cat命令
  • 原文地址:https://www.cnblogs.com/alice626/p/4961680.html
Copyright © 2011-2022 走看看