javascript中replace( )方法的使用

最近在浏览一些阿里的前端面试题，其中有一题涉及了javascript中replace( )方法的使用，下面是原题：

“说出以下函数的作用是？空白区域应该填写什么？”

 // define
 (function (window) {
   function fn(str) {
     this.str = str;
   }
   fn.prototype.format = function () {
     var arg = ______;
     return this.str.replace(_______, function (a, b) {
       return arg[b] || '';
     });
   }
   window.fn = fn;
 })(window);
 // use
 (function(){
   var t = new fn('<p><a href="{0}">{1}</a><span>{2}</span></p>');
   console.log( t.format('http://www.alibaba.com', 'Alibaba', 'Welcome') );
 })();

以下是分析过程（感觉还是弄个编号，个人觉得比较有条理一些）

1、因为本题也涉及了到其它的知识点，如匿名函数、原型等知识点，但不是本次讨论的重点。

2、根据题面，我们知道，该题的源码类似于写一个模板引擎。将模板里的‘{1}'之类的占位符替换成传给它的参数。所以arg应该就是arguments。但是！！！由于arg不是数组，而是一个类数组对象（不懂的可自行百度(u_u)），所以我们需要进行一些转换，

代码如下:

var arg=Array.prototype.slice.call(arguments,0);

3、等号右边也就是第一空的答案了。说了这么多，那么接下来第二空就是我们要讨论的重点了~~~~~~我们都知道第二空是要通过正则找出占位符，并根据占位符内的数字将其替换成arg数组内的字符串，说实话replace方法的第二个参数为函数的情况很少遇到，一般我们遇到都是这样的，看下面的代码：

代码如下:

var pattern=/8(.*)8/;
 var str='This is a 8baidu8';
 document.write(str.replace(pattern,'<strong>$1</strong>'));

4、由于replace第二个参数是函数的情况比较少，那么我们就来重点谈谈第二个参数为函数的情形。

首先这是replace函数的语法：stringobject.replace(regexp/substr,replacement)

其中regexp/substr必需。规定字符串或要替换的模式的regexp对象。(请注意，如果该值是一个字符串，则将它作为要检索的直接量文本模式，而不是首先被转换为 regexp 对象。) replacement必需。一个字符串值。规定了替换文本或生成替换文本的函数。最后返回一个新的字符串，是用replacement替换了regexp的第一次匹配或所有匹配之后得到的。

5、ECMAScript规定，replace（）方法的参数replacement可以是函数而不是字符串。在这种情况下，每个匹配都调用该函数，它返回的字符串将替换文本使用。第一个参数表示匹配到的字符，第二个参数表示匹配到的字符最小索引位置（RegExp.index），第三个参数表示被匹配的字符串（RegExp.input）。

6、所以第二空可以这样写：/\{(\d+)\}/g，放在语句中完整为：

代码如下:

return this.str.replace(/\{(\d+)\}/g, function (a, b) { 
    return arg[b] || ''; 
});

执行第一次匹配时，{0}被替代为arg[0]
执行第一次匹配时，{1}被替代为arg[1]
执行第一次匹配时，{2}被替代为arg[2]

7、以上就是js字符串方法replace()的第二个参数为函数讲解（有不完善的地方，自行补充）,当然这道面试题也解决了~~~~~

以上所述就是本文的全部内容了，希望大家能够喜欢。

赞 (0)

相关推荐

  • javascript正则表达式使用replace()替换手机号的方法

    本文实例讲述了javascript正则表达式使用replace()替换手机号的方法.分享给大家供大家参考. 具体实现方法如下: 复制代码 代码如下: <html> <head> <title>javascript正则表达式使用replace()替换手机号</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" />

  • JavaScript字符串对象replace方法实例（用于字符串替换或正则替换）

    JavaScript replace 方法 replace 方法用于在字符串中用一些字符串替换另一些字符串,或者替换符合正则匹配的字符串,并返回替换后的字符串.其语法如下: 复制代码 代码如下: str_object.replace(reg_exp/str, replacement) 参数说明: 参数 说明 str_object 要操作的字符串(对象) reg_exp/str 必需.要匹配的正则表达式/要替换的字符串 如果 reg_exp 具有全局标志 g,那么 replace() 方法将替换所

  • javascript正则表达式中的replace方法详解

    前面的文章我已经介绍了正则的四个基本方法,当时也提到过replace方法 我们来回顾一下replace方法的使用: 先定义一个正则对象:var re=/中间写匹配的条件/; replace():正则匹配字符串,若是匹配成功,将匹配成功的字符串用新的字符串来替换 语法:字符串.replace(re,新的字符串): 举个例子:网络中经常会遇到,不文明的词会被*代替,我们来试一下: <!DOCTYPE> <html> <head> <meta charset='utf-

  • JS中的Replace方法使用经验分享

    JS中的Replace方法使用经验分享

    最近查一个bug,原因是JS中的Replace方法造成的,当将一个字符串中有处需要替换时,一般会用到JS中的Replace方法,Replace方法的第一个参数如果是传的字符串,只会替换第一处.代码如下: 复制代码 代码如下: var str = "0CEA65D5-DB8E-4876-A6F8-C88AC7F0E185,E846C244-8A19-4374-879B-0B1DC08D1747,6CB3EBA4-1E22-4E4D-8800-AE31130B6F5D"; alert(st

  • js正则表达式replace替换变量方法

    JavaScript正则实战(会根据最近写的不断更新) 1.javascript 正则对象替换创建 和用法: /pattern/flags 先简单案例学习认识下replace能干什么 正则表达式构造函数: new RegExp("pattern"[,"flags"]); 正则表达式替换变量函数:stringObj.replace(RegExp,replace Text); 参数说明: pattern -- 一个正则表达式文本 flags -- 如果存在,将是以下值:

  • js replace(a,b)之替换字符串中所有指定字符的方法

    如下所示: var str = 'abcadeacf'; var str1 = str.replace('a', 'o'); alert(str1); // 打印结果: obcadeacf var str2 = str.replace(/a/g, 'o'); alert(str2); //打印结果: obcodeocf, 注意: 此处replace的第一个参数为正则表达式,/g是全文匹配标识. 以上这篇js replace(a,b)之替换字符串中所有指定字符的方法就是小编分享给大家的全部内容了,

  • 详解JavaScript 中的 replace 方法

    定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串. stringObject.replace(regexp/substr,replacement) 参数 描述 regexp/substr 必需.规定子字符串或要替换的模式的 RegExp 对象. 请注意,如果该值是一个字符串,则将它作为要检索的直接量文本模式,而不是首先被转换为 RegExp 对象. replacement 必需.一个字符串值.规定了替换文本或生成替换文本的函数. 返回值

  • 详解JS正则replace的使用方法

    在讲replace的高级应用之前,我们先简单梳理一下JS正则中的几个重要的知识点,以帮助你对基础知识的回顾,然后再讲解JS正则表达式在replace中的使用,以及常见的几个经典案例. 一.正则表达式的创建 JS正则的创建有两种方式: new RegExp() 和 直接字面量. //使用RegExp对象创建 var regObj = new RegExp("(^\s+)|(\s+$)","g"); //使用直接字面量创建 var regStr = /(^\s+)|(\

  • 使用JS中的Replace()方法遇到的问题小结

    今天在写pc客户端自动化打包脚本的时候遇到遇到了几个问题,虽然是小问题,但是也卡了一段时间,所以决定记录一下. js的replace()方法是用于替换某些内容,它可以接收两个参数,第一个是一个被替换的正则表达式对象或者一个字符串,第二个可以是将要替换成的内容或者函数,将要替换成的内容须是一个字符串.我在执行的时候遇到的报错是:Cannot read property 'replace' of undefined.具体代码如下: var fs=require("fs") var info

  • javascript中replace( )方法的使用

    最近在浏览一些阿里的前端面试题,其中有一题涉及了javascript中replace( )方法的使用,下面是原题: "说出以下函数的作用是?空白区域应该填写什么?" // define (function (window) { function fn(str) { this.str = str; } fn.prototype.format = function () { var arg = ______; return this.str.replace(_______, functio

  • 浅谈javascript中replace()方法

    浅谈javascript中replace()方法

    定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串. 语法 stringObject.replace(regexp/substr,replacement) 返回值 一个新的字符串,是用 replacement 替换了 regexp 的第一次匹配或所有匹配之后得到的. 说明 字符串 stringObject 的 replace() 方法执行的是查找并替换的操作.它将在 stringObject 中查找与 regexp 相匹配的子字符串,然后

  • JavaScript中removeChild 方法开发示例代码

    1. 概述 删除后的节点虽然不在文档树中了,但其实它还在内存中,可以随时再次被添加到别的位置. 当你遍历一个父节点的子节点并进行删除操作时,要注意,children属性是一个只读属性,并且它在子节点变化时会实时更新 // 拿到待删除节点: var self = document.getElementById('to-be-removed'); // 拿到父节点: var parent = self.parentElement; // 删除: var removed = parent.remove

  • javascript的replace方法结合正则使用实例总结

    本文实例总结了javascript的replace方法结合正则使用方法.分享给大家供大家参考,具体如下: replace()方法用于在字符串中用一些字符替换另一些字符,或者替换一个正则表达式匹配的字符串 例子一:直接使用repalce替换 var stringObj="终古人民共和国,终古人民"; //替换错别字"终古"为"中国" //并返回替换后的新字符 //原字符串stringObj的值没有改变 var newstr=stringObj.re

  • Python中replace方法实例分析

    本文以实例形式讲述了Python中replace方法,很有实用价值,具体如下: replace方法主要有两种: last_date = "1/2/3" 目标为"123" 方法一:repalce date =last_date.replace('/','') 方法二:re p = re.compile("/") date = p.sub('', last_date) 需要注意的是:一定不要转义,否则函数不会生效. replace 方法返回根据正则表

  • 浅析Javascript中bind()方法的使用与实现

    在讨论bind()方法之前我们先来看一道题目: var altwrite = document.write;  altwrite("hello");  //1.以上代码有什么问题 //2.正确操作是怎样的 //3.bind()方法怎么实现 对于上面这道题目,答案并不是太难,主要考点就是this指向的问题,altwrite()函数改变this的指向global或window对象,导致执行时提示非法调用异常,正确的方案就是使用bind()方法: altwrite.bind(document

  • Javascript中的方法和匿名方法实例详解

    本文实例讲述了Javascript中的方法和匿名方法.分享给大家供大家参考.具体分析如下: Javascript方法(函数) 声明函数 以function开头,后跟函数名,与C#.java不同,Javascript不需要声明返回值类型.参数类型.没有返回值就是undefined. 举个例子更清楚:  无参数无返回值的方法: function f1(){ alert('这是一个方法'); } f1();//调用方法 无参数有返回值的方法: function f2(){ return 100; }

  • JavaScript中随机数方法 Math.random()

    JavaScript中随机数方法 Math.random()

    目录 定义 基础写法 生成指定范围内的随机数 生成两个数之间的随机数 常用场景 前言: 我们学习项目的时难免遇到一些问题,比如;遇到一个功能需要随机返回多条不重复的数据,也可以是拿了就用,下次再需要时已经忘记如何使用了:虽然接触使用的场景很少,但也有必要单独拿出来讲一讲 定义 js中的生成随机数操作是基于 Math 方法下的 random() 方法 Math.random() : 随机获取范围内的一个数 ( 精确到小数点后14位 ) 基础写法 随机生成一个 0 ~ 1 之间的数:  // 语法:

  • javascript中replace使用方法总结

    ECMAScript提供了replace()方法.这个方法接收两个参数,第一个参数可以是一个RegExp对象或者一个字符串,第二个参数可以是一个字符串或者一个函数.现在我们来详细讲解可能出现的几种情况. 1. 两个参数都为字符串的情况 var text = 'cat, bat, sat, fat'; // 在字符串中找到at,并将at替换为ond,只替换一次 var result = text.replace('at', 'ond'); // "cond, bat, sat, fat"

  • Javascript中replace()小结

    关于定义 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串. 关于语法 stringObject.replace(regexp/substr,replacement) 关于参数 参数 描述 regexp/substr 必需.规定子字符串或要替换的模式的 RegExp 对象. 请注意,如果该值是一个字符串,则将它作为要检索的直接量文本模式,而不是首先被转换为 RegExp 对象. replacement 必需.一个字符串值.规定了替换文本或生成替换文

随机推荐